自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(15)
  • 收藏
  • 关注

原创 Vue的生命周期

Vue的生命周期该图摘自官方文档Vue的生命周期钩子函数:beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、beforeDestroy、destroyed;共八个;理解它的生命周期以及这些钩子函数在很大程度上将会促进我们对Vue执行机制的理解。beforeCreate、created意为创建之前和创建完成后;这两...

2018-11-29 11:21:52 194

原创 better-scroll实现列表联动(移动端)

在移动端手机滑动浏览列表是没有滚动条的,那么如何实现没有滚动条又能够滚动呢?这时候会用到一个常用的插件:better-scroll,利用它来实现移动端的滚动。其原理是利用translate来实现滚动,看下调试:这个div是需要滚动的列表的父元素,transition-timing-function是为了让translate这个过渡效果更像原生scroll。使用这个组件你需要有特定的结构,借一...

2018-11-23 17:00:55 4417 2

原创 ajax的4个步骤,以及get和post的区别

第一步:创建xmlhttprequest对象,var xml =new XMLHttpRequest();//XMLHttpRequest是一个包装好的函数直接调用就行了,他是用来和服务器交互。第二步:注册回调函数 xmlhttp.onreadystatechange=callback;第三步:使用xmlhttprequest对象的open()和send()方法发送资源请求给服务器;//...

2018-11-23 16:23:54 862

原创 vue 组件间的互相传值

使用vue时,灵活的实现互相传值对实现页面效果是非常有必要的。1.首先我们来看看父子之间的相互传值。首先是父传子和子传父:html:父级的组件<div id="app"> <table> <tr> <td colspan="3">父组件</td> &

2018-11-23 16:16:57 290

原创 better-scroll的用法

better-scroll是种手机App中使用的滑动插件。下载方法不说了,和其他插件下载方式相同。首先我们要在文件中引用 import Better from 'better-scroll然后我们看格式这里利用的是overflow-hidden,要注意的地方是overflow-hidden的元素下只能只有一个元素<div class="nav-left" ref="navleft...

2018-11-23 16:12:24 370

原创 Vue-Cli(脚手架)简单讲解

这里讲解一下Vue-Cli的一些基本使用方法一般新创建好的脚手架:一、插件的配置我们所需要的所有插件都要写在package.json这个文件中:然后在cmd中输入npm install然后就会自动把你所需要的插件下载下来,当然一些最基础的插件已经下载配置好了,当然插件下载下来之后还需要在App.vue文件中进行配置,最常用的插件有:ajax插件‘axios’,库插件‘Vuex’这相当于...

2018-11-16 17:31:46 176

原创 Vue-Cli搭建Vue项目

Vue作为现今的三大框架之一,且因为比较轻量所以被大量使用,而vue-cli(脚手架)能快速的搭建一个vue项目,也被大量的使用。一、创建基础Vue-cli基于node和npm,所以需要先安装nodejs,npm会在node安装时自动安装所以不用特意安装。最新node下载地址:https://nodejs.org/en/安装完之后别忘在cmd中分别输入 node –v 、npm –v查看是否...

2018-11-16 10:52:42 82

原创 Web前端性能优化的方法

网页内容:1.减少http请求次数2.减少DNS查询次数3.避免页面跳转4.缓存Ajax5.延迟加载6.提前加载 7.减少DOM元素数量 8.根据域名划分内容 9.减少iFrame数量 10.避免404服务器:1.使用CDN2.添加Expires或Cache-Control报文头3.Gzip压缩传输文件4.配置ETags:Etags(Entity tags)是服务器和...

2018-11-06 17:31:31 393

原创 渐进增强和优雅降级之间的区别

渐进增强和优雅降级是两种不同的编写兼容的思路渐进增强和优雅降级这两个概念是在 CSS3 出现之后火起来的。由于低级浏览器不支持 CSS3,但是 CSS3 特效太优秀不忍放弃,所以在高级浏览器中使用CSS3,而在低级浏览器只保证最基本的功能。二者的目的都是关注不同浏览器下的不同体验,但是它们侧重点不同,所以导致了工作流程上的不同。概念解释渐进增强:一开始就针对低版本浏览器进行构建页面,完成基本...

2018-10-15 11:50:05 762

原创 如何使用 HTML5 嵌入音频和视频(媒体标签)

在HTML5中提供了audio 和 video这两个新标签来嵌入音频和视频内容。另外还提供了与这两个标签相关的 JavaScript API,以此来创建我们自己的音视频控件:<!-- 嵌入视频 --><video> <source src="xx.mp4" type="video/mp4> <source src="xx.ogv" t...

2018-10-15 11:09:53 4079

原创 JS闭包的理解

闭包实现了同时具有全局变量的特点和局部变量的特点。 闭包既能够让函数能够去全局中获得其他方法作用域中的变量,还不会影响到全局中的那些变量,使他们互相影响。 主要通过Return function 保存住变量。 形成闭包的三个条件:1.被保护的变量 2.return出可以操作局部变量的内层函数 3.必须成为全局对象的一个属性。 如何清除闭包在函数中在最后加上“=null”。...

2018-08-24 15:54:19 1314

原创 JS中Math对象的API

下面对Math()对象API做一个统计: abs(x) 返回数的绝对值。 acos(x) 返回数的反余弦值。 asin(x) 返回数的反正弦值。 atan(x) 以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。 atan2(y,x) 返回从 x 轴到点 (x,y) 的角度(介于 -PI/2 与 PI/2 弧度之间)。 ceil(x) 对数进行上舍入。 co...

2018-08-24 15:48:22 471

原创 JS中堆和栈的区别

JS中的堆和栈是一种十分抽象的概念,事实上是不存在的。栈指的是本身存在的内容,存储在本地的内容。而堆指的是在本地放不下的内容,这个时候就由堆中的地址来寻找这些内容。...

2018-08-06 21:14:24 3196

原创 论绝对定位和相对定位

绝对定位和相对定位是为了解决HTML无法将内容放置到我们所想要放置的位置上的这个问题所使用的。绝对定位和相对定位都是通过将内容脱离文档流来达到可以自由定位的。相对定位是相对于它自身进行定位,而绝对定位是相对于参照物进行定位的。子级进行绝对定位,那么父级必须进行相对定位,不然子级就会以父级之前的进行过相对定位的内容作为参照物,若都没有进行相对定位,那么它将会以body作为参照物进行绝对定位。...

2018-08-02 21:01:29 167

原创 CSS浮动“FLOAT”的使用要点

FLOAT的主要功能是让网页中的内容脱离文档流,然后移动到你所在块中最上方,由left和right来决定是浮动到左边还是右边。FLOAT是用来解决网页能容无法并列的问题的,因为文档流是从上到下的,是无法并列的。但FLOAT,在使用完之后是需要清楚地,一旦忘记清除浮动,那么整个网页的排版都会变得混乱。FLOAT的清除主要可以通过,在块元素中添加内容。 例如使用伪类添加一个空的内容: div:af...

2018-08-02 09:42:34 187

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除