肥林の仓库

github徽标 github徽标可以直接通过shields.io在线生成。 理论上可以放在页面的任何地方。教程案例是添加在页脚。 工具网站包括： 徽标生成网站:shields.io 图标查询网站:simpleicons html压缩网站:htmlpack 预览结果展示: 具体实现步骤:(简单实现) 通过shields.io在线生成。 label:标签，徽标左侧内容 message:信息，徽标右侧内容 color:色值,支持支持十六进制、rgb、rgba、hsl、hsla和 css 命名颜色。十六进制记得删除前面的#号 输入相关信息后，点击make badge即可得到徽标的URL。可以用img标签引用，写法简单。不过正式写法建议用object标签引用，写法示例如下。 <!-- label=Frame，Message=Hexo，color=blue -->https://img.shields.io/badge/Frame-Hexo-blue<!-- 在页面上可以使用img标签来引用 --><img src="https://img.s ...

给页面添加轮播图 就拿 我的博客 为例 效果图如下: 教程开始: 首先安装插件(在博客的根目录下打开控制台,运行以下指令,魔改4有教) npm install hexo-butterfly-swiper --save 添加配置信息(在站点配置文件_config.yml或者主题配置文件_config.butterfly.yml中添加一下代码) # hexo-butterfly-swiper# see https://akilar.top/posts/8e1264d1/swiper: enable: true # 开关 priority: 5 #过滤器优先权 enable_page: all # 应用页面 timemode: date #date/updated layout: # 挂载容器类型 type: id name: recent-posts index: 0 default_descr: 再怎么看我也不知道怎么描述它的啦！ swiper_css: https://npm.elemecdn.com/hexo-butterfly-s ...

1.Vue中的事件处理Vue中事件的基本使用: 1.使用v-on:xxx 或 @xxx 绑定事件，其中xxx是事件名； 2.事件的回调需要配置在methods对象中，最终会在vm上；不要放在data{}里面,这样就会将回调函数做一次数据代理,降低效率(回调函数不需要数据代理) 3.methods中配置的函数，不要用箭头函数！否则this就不是vm了；(箭头函数没有this指向,他会向上指向Windows) 4.methods中配置的函数，都是被Vue所管理的函数，this的指向是vm 或 组件实例对象； 5.@click=”demo” 和 @click=”demo($event)” 效果一致，但后者更灵活可以传递其他参数!前者一传递其他参数就会丢失 event 事件对象； <!-- 准备好一个容器--><div id="root"> <h2>欢迎来到{{name}}学习</h2> <!-- 1.完整写法 --> <!-- <bu ...

1.JavaScript中的event事件(鼠标事件，键盘事件，HTML事件)(1). 鼠标事件 鼠标按下 onmousedown 鼠标弹起 onmouseup 鼠标移出 onmouseout 鼠标移进 onmouseover 鼠标移动 onmousemove 鼠标悬停 onmouseenter 鼠标取消悬停 onmouseleave 代码展示:box.onmousedown = function() { console.log('鼠标按下了');}box.onmouseup = function() { console.log('鼠标弹起了');}box.onmouseout = function() { console.log('鼠标移出了');}box.onmouseover = function() { console.log('鼠标移进了');}box.onmouseenter = funct ...

1.模板语法什么是模板? Root容器中的代码就被称为Vue的模板，每当我们引入Vue.js过后,全局就多了一个名为Vue的构造函数. 模板语法一般分为两种: 1.插值语法(一定要切记,使用模板语法过后,语法包括的值就不再是字符串..他就是js表达式了) 功能：用于解析标签体内容。(就是起始标签和结束标签包括的内容) 写法：，xxx是js表达式，且可以直接读取到data中的所有属性。 2.指令语法 功能：用于解析标签（包括：标签属性、标签体内容、绑定事件…..）。 举例：v-bind:href=”xxx” 或  简写为 :href=”xxx”，xxx同样要写js表达式，且可以直接读取到data中的所有属性。 备注:Vue中有很多的指令，且形式都是：v-????，此处我们只是拿v-bind举个例子。<!-- 准备好一个容器-->    <div id="root">        <h1>插值语法</h1>        <h3>你好，{{name}& ...

继承1.call()方法介绍 ES6之前并没有给我们提供 extends 继承。我们可以通过构造函数+原型对象模拟实现继承，被称为组合继承。 Call()方法的作用: 1.调用指向函数 2.修改函数的this指向 语法格式: fun.call(thisArg, arg1, arg2, …) 1.thisArg ：当前调用函数 this 的指向对象 2.arg1，arg2：传递的其他参数// call 方法function fn(x, y) {    console.log('我想喝手磨咖啡');//正常输出我想喝手磨咖啡    console.log(this);//window    console.log(x + y);//NaN,这时添加参数}        var o = {    name: 'andy'};// fn();// 1. call() 可以调用函数fn.call();//与fun();的结果一致,表示call()方法也有函数调用的功能// 2. call() 可以改变这个函数的t ...

1.初识构造函数和原型 Es6以前我们面向对象是使用构造函数来实现的，将一些对象的公共方法和属性放在构造函数里面，再通过构造函数来实例化对象，这种方法虽然好用，但是存在问题：浪费内存 对象当中的属性还好说，但是方法(函数)是复杂是数据类型,当我们在创建对象的时候,这个方法会单独的再开辟一个内存空间,来存放这个复杂的数据类型,那么再次调用一个类来创建对象,他里面又有这个sing方法,那又会在开辟一个内存空间来存放这个方法(函数),就相当于开辟两个内存空间来存放相同的方法(函数),那么我有100实例对象呢?而且开辟内存空间还需要时间,如果实例对象过多就会大量的浪费时间// 打印一下判断两个sing是否再同一个内存空间console.log(ldh.sing === zxy.sing);//false// 说明:构造函数每一次实例化都西昂都要开辟一块新的内存空间来存放公共方法(函数) 运行结果: 2.构造函数原型(prototype) JavaScript 规定，每一个构造函数都有一个 prototype 属性，指向另一个对象。注意这个 prototype 就是一个对象，这个对象的所有属性 ...

1.axios取消请求的基本使用 axios取消请求方式一般有两种,我们这里学习使用CancelToken的构造函数的方式取消请求 axios有一个CancelToken属性，他是一个类，用于获取取消请求的cancel方法，获取了该方法之后就可以在合适的地方执行cancel()取消请求了。这种方式比较麻烦，但是可以用于取消多个请求 代码如下:// 1.请求拦截器(这里的请求拦截器什么也不走,就接收数据返回数据)axios.interceptors.request.use((config)=>{ console.log('请求拦截器执行了',config); return config})// 3.响应拦截器(比请求拦截器应用得更广泛,项目开发没有不用相应拦截器的)axios.interceptors.response.use( // 成功的回调 response =>{ console.log('响应拦截器成功的回调执行了!', response); ...

添加音乐播放器(aplayer) 官方文档-添加插件 就拿 我的博客 为例 教程开始 首先安装 hexo-tag-aplayer 这款插件。执行如下指令：(在你博客根目录下打开控制台安装)npm install --save hexo-tag-aplayer 如图所示:(打开控制台方式)点击回车!开始安装 随后在你博客的根目录下的_config.yml(切记是根目录下,不是主题文件下)添加音乐播放器模块,如下所示 aplayer: meting: true asset_inject: false 开启主题配置文件中_config.yml的 aplayerInject,(切记这次是你主题文件下的_config.yml)aplayerInject: enable: true per_page: true 到这里音乐页面就基本配置完成了,下面是音源配置教程 音源配置教程 以本博客为例，在博客的音乐页面（\source\music\index.md文件）添加如下代码：{% meting "7539051570" ...

添加标签云 官方文档 安装流程: 进入到 hexo 的根目录，然后在 package.json 中添加依赖: “hexo-tag-cloud”: “2.1.*” 执行 npm install 命令 然后需要你去修改主题的 tagcloud 的模板，这个依据你的主题而定 就那我的主题为例,我的主题是butterfly 首先找到 Butterfly/layout/includes/widget/card_tags.pug 文件 然后将文件内容转换成如下代码:if site.tags.length .card-widget.card-tags .card-content .item-headline i.fa.fa-tags(aria-hidden="true") span= _p('aside.card_tags') script(type="text/javascript" charset="utf-8" ...