如初的博客🥝

发表于 2024-10-15 | 更新于 2024-10-18

Markdown Content: 1.前言博客搭建过程遇到任何问题，优先在本页面搜索，检查是否已经有该配置教程。遇到问题可以优先在文章评论区留言，注意留言时请填写正确的邮箱以确保能收到站长的回复。实在解决不了的问题可添加站长的微信进行交流，备注自己的个人信息。 2.环境与工具准备本教程主要面对的是Windows用户操作系统：Windows10 Node Git Hexo 文本编辑器(强烈推荐VSCODE) GitHub 帐号一个域名（强烈推荐买个域名）云服务器（可选） 3.Node的安装打开Node官网，下载和自己系统相配的Node的安装程序，否则会出现安装问题。下载地址：https://nodejs.org/en/download/ 我个人的版本是 12.19.0，目前版本已经更新到19.0.0，按照个人经验，可以选个低一些的版本，可以和我的一样，否则后面会出现各种不兼容的问题！我之前就是安装16的，系统无法识别，如果大家遇到问题建议选个低版本的！历史版本下载页面：https://nodejs.org/en/download/releases/ 下 ...

HEXO的安装流程

发表于 2024-10-14 | 更新于 2024-10-24

Hexo 安装教程 Hexo 是一个快速、简洁且高效的静态博客框架，基于 Node.js 构建。下面是 Hexo 的安装和配置教程。 1. 环境要求在安装 Hexo 之前，请确保您的电脑上已经安装了以下软件： Node.js（版本 12.x 或更高） Git（用于版本控制）您可以通过以下命令检查 Node.js 和 Git 是否已安装： 12node -vgit --version 安装 Node.js 和 Git 如果尚未安装 Node.js 和 Git，请参考以下链接进行安装： Node.js 官方下载 Git 官方下载根据您操作系统的要求下载并安装即可。安装 Hexo 打开终端或命令提示符，运行以下命令安装 Hexo：

Markdown语法与外挂标签写法汇总

发表于 2022-08-09 | 更新于 2022-10-23

🥧本文汇总Markdown格式以及外挂标签在网页端的渲染效果，可作为文档进行查询

00-事件驱动和非阻塞机制

发表于 2019-04-26 | 更新于 2024-10-22 | Nodejs | Nodejs

异步编程异步操作 Node 采用 Chrome V8 引擎处理 JavaScript 脚本。V8 最大特点就是单线程运行，一次只能运行一个任务。 Node 大量采用异步操作（asynchronous operation），即任务不是马上执行，而是插在任务队列的尾部，等到前面的任务运行完后再执行。提高代码的响应能力。异步IO也叫非阻塞IO。例如读文件，传统的语言，基本都是读取完毕才能进行下一步操作。非阻塞就是Node的callback，不会影响下一步操作，等到文件读取完毕，回调函数自动被执行，而不是在等待。异步操作回调由于系统永远不知道用户什么时候会输入内容，所以代码不能永远停在一个地方。 Node 中的操作方式就是以异步回调的方式解决无状态的问题。回调函数的设计：错误优先异步操作中，无法通过 try catch 捕获异常。这是因为回调函数主要用于异步操作，当回调函数运行时，前期的操作早结束了，错误的执行栈早就不存在了，传统的错误捕捉机制try…catch对于异步操作行不通，所以只能把错误交给回调函数处理。统一约定：回调函数的第一个参数默认接收错误信息 ...

00-Vue的介绍和vue-cli

发表于 2019-04-26 | 更新于 2024-10-22 | Vue | Vue

MVVM模式 Model：负责数据存储 View：负责页面展示 View Model：负责业务逻辑处理（比如Ajax请求等），对数据进行加工后交给视图展示关于框架为什么要学习流行框架 1、企业为了提高开发效率：在企业中，时间就是效率，效率就是金钱；企业中，使用框架，能够提高开发的效率。提高开发效率的发展历程：原生JS -> Jquery之类的类库 -> 前端模板引擎 -> Angular.js / Vue.js（能够帮助我们减少不必要的DOM操作；提高渲染效率；双向数据绑定的概念【通过框架提供的指令，我们前端程序员只需要关心数据的业务逻辑，不再关心DOM是如何渲染的了】） 2、在Vue中，一个核心的概念，就是让用户不再操作DOM元素，解放了用户的双手，让程序员可以更多的时间去关注业务逻辑。 3、增强自己就业时候的竞争力：人无我有，人有我优。你平时不忙的时候，都在干嘛？框架和库的区别框架：框架是一套完整的解决方案。对项目的侵入性较大，项目如果需要更换框架，则需要重新架构整个项目。但是优点也很明显：功能完善、提供了一整套的 ...

01-02.v-on的事件修饰符

发表于 2019-04-26 | 更新于 2024-10-22 | Vue | Vue

v-on的事件修饰符 v-on的常见事件修饰符 v-on 提供了很多事件修饰符来辅助实现一些功能。事件修饰符有如下： .stop 阻止冒泡。本质是调用 event.stopPropagation()。 .prevent 阻止默认事件（默认行为）。本质是调用 event.preventDefault()。 .capture 添加事件监听器时，使用捕获的方式（也就是说，事件采用捕获的方式，而不是采用冒泡的方式）。 .self 只有当事件在该元素本身（比如不是子元素）触发时，才会触发回调。 .once 事件只触发一次。 ``.{keyCode | keyAlias}` 只当事件是从侦听器绑定的元素本身触发时，才触发回调。 ``.native` 监听组件根元素的原生事件。 PS：一个事件，允许同时使用多个事件修饰符。写法示范： 1234567891011121314151617181920 <button v-on:click="doThis"></button& ...

01-06.自定义按键修饰符&自定义指令

发表于 2019-04-26 | 更新于 2024-10-22 | Vue | Vue

v-on的按键修饰符 Vue 内置的按键修饰符通俗一点讲，指的是：监听键盘输入的事件。Vue 允许为 v-on 在监听键盘事件时添加按键修饰符。如下： Vue内置的按键修饰符： 12345678910.enter.tab.delete (捕获 “删除” 和 “退格” 键).esc.space.up.down.left.right1.0.8+版本：支持单字母的按键别名。比如说，keyup指的是：键盘（任何键位）抬起时的监听事件。.enter指的是：按enter键的按键修饰符。我们把这两个结合起来看看。 @keyup.enter举例：按enter键后的监听事件 @keyup.enter="addData"表示：按住enter键后，执行addData()方法。全称是v-on:key.enter="addData"。我们还是拿01-04这篇文章中的列表功能来举例。之前是点击“添加”按钮后，列表中会添加一个item。现在要求：在输入框中按enter键后，也能添加一个item。核心代码如下： 1<input type="text&qu ...

01-03.Vue的系统指令(二)

发表于 2019-04-26 | 更新于 2024-10-22 | Vue | Vue

前言文本主要内容： v-model v-model：双向数据绑定（只能用于表单元素）之前的文章里，我们通过v-bind，给<input>标签绑定了data对象里的name属性。当data里的name的值发生改变时，<input>标签里的内容会自动更新。可我现在要做的是：我在<input>标签里修改内容，要求data里的name的值自动更新。从而实现双向数据绑定。该怎么做呢？这就可以利用v-model这个属性。区别： v-bind：只能实现数据的单向绑定，从 M 自动绑定到 V。 v-model：只有v-model才能实现双向数据绑定。注意，v-model 后面不需要跟冒号，注意：v-model 只能运用在表单元素中。常见的表单元素包括：input(radio, text, address, email…) 、select、checkbox 、textarea。代码举例如下： 123456789101112131415161718192021222324252627282930313233343536373839<!D ...

01-HTML5详解

发表于 2019-04-26 | 更新于 2024-10-22 | 前端 | HTML5

HTML5的介绍 Web 技术发展时间线 1991 HTML 1994 HTML2 1996 CSS1 + JavaScript 1997 HTML4 1998 CSS2 2000 XHTML1（严格的html） 2002 Tableless Web Design（表格布局） 2005 AJAX 2009 HTML5 2014 HTML5 Finalized 2002年的表格布局逐渐被淘汰，是因为：表格是用来承载数据的，并不是用来划分网页结构的。 2009年就已经推出了HTML5的草案，但直到2014年才有定稿，是因为有移动端的推动。 H5草案的前身是叫：Web Application，最早是由WHATWG这个组织在2004年提出的。 2007年被 W3C 组织接纳，并在 2008-01-22 发布 HTML5 的第一个草案。什么是 HTML5 HTML5并不仅仅只是做为HTML标记语言的一个最新版本，更重要的是它制定了Web应用开发的一系列标准，成为第一个将Web做为应用开发平台的HTML语言。 HTML5定义了一系列新元素，如新语义标签 ...

01-CSS属性：字体属性和文本属性

发表于 2019-04-26 | 更新于 2024-10-22 | css | css

本文重要内容 CSS的单位字体属性文本属性定位属性：position、float、overflow等 CSS的单位 html中的单位只有一种，那就是像素px，所以单位是可以省略的，但是在CSS中不一样。 CSS中的单位是必须要写的，因为它没有默认单位。绝对单位： 1 in=2.54cm=25.4mm=72pt=6pc。各种单位的含义： in：英寸Inches (1 英寸 = 2.54 厘米) cm：厘米Centimeters mm：毫米Millimeters pt：点Points，或者叫英镑 (1点 = 1/72英寸) pc：皮卡Picas (1 皮卡 = 12 点) 相对单位： px：像素 em：印刷单位相当于12个点 %：百分比，相对周围的文字的大小为什么说像素px是一个相对单位呢，这也很好理解。比如说，电脑屏幕的的尺寸是不变的，但是我们可以让其显示不同的分辨率，在不同的分辨率下，单个像素的长度肯定是不一样的啦。百分比%这个相对单位要怎么用呢？这里也举个例子：字体属性行高 CSS中，所有的行，都有行高。盒子模型的padding ...

01-05.自定义过滤器：时间格式化举例

发表于 2019-04-26 | 更新于 2024-10-22 | Vue | Vue

前言我们接着上一篇文章01-04来讲。过滤器的概念概念：Vue.js 允许我们自定义过滤器，可被用作一些常见的文本格式化。过滤器可以用在两个地方：mustache 插值表达式、 v-bind表达式。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符指示。 Vue1.X中的系统过滤器 Vue提供了一系列的固定逻辑来使程序员更加容易的实现这些功能，这些过滤器称之为系统过滤器。系统过滤器是Vue1.0中存在的，在Vue2.0中已经删除了。系统过滤器的使用，可以参考参考文档：http://v1-cn.vuejs.org/api/#过滤器 Vue也提供了一个接口用来供程序员定义属于自己的特殊逻辑，Vue称之为自定义过滤器。我们接下来讲一讲。自定义全局过滤器文档地址：http://v1-cn.vuejs.org/guide/custom-filter.html 全局过滤器的基本使用我们可以用全局方法Vue.filter()自定义一个全局过滤器。这样的话，每一个Vue的对象实例（每一个VM实例）都可以拿到这个过滤器。它接收两个参数：过滤器的名称、过滤器函数。 ...

01-JS简介

发表于 2019-04-26 | 更新于 2024-10-22 | JavaScript | JavaScript

JavaScript背景 Web前端有三层： HTML：从语义的角度，描述页面结构 CSS：从审美的角度，描述样式（美化页面） JavaScript：从交互的角度，描述行为（提升用户体验） JavaScript是世界上用的最多的脚本语言。发展历史 JavaScript诞生于1995年。布兰登 ? 艾奇（Brendan Eich，1961年～），1995年在网景公司，发明的JavaScript。 JavaScript是由网景公司发明，起初命名为LiveScript，后来由于SUN公司的介入更名为了JavaScript。备注：由于当时Java这个语言特别火，所以为了傍大牌，就改名为JavaScript。如同“北大”和“北大青鸟”的关系。“北大青鸟”就是傍“北大”大牌。同时期还有其他的网页语言，比如VBScript、JScript等等，但是后来都被JavaScript打败了，所以现在的浏览器中，只运行一种脚本语言就是JavaScript。 JavaScript和ECMAScript的关系 ECMAScript是一种由Ecma国际（前身为欧洲计算机制造商协会,英文名称 ...