面试笔记-2
DOMContentLoaded与load简介DOMContentLoaded事件在页面文档加载解析完毕之后马上执行。而不会等待图片文件和子框架页面的加载
load事件会在页面所有资源被加载进来之后才会触发load事件。load时间在DOMContentLoaded事件触发之后
页面的加载顺序：
1.从上往下解析html节点，生成dom树和css树
2.如果遇到js或css文件，则加载js脚本文件和css等
3.js脚本如果是内联，则会执行脚本，否则继续解析
4.在页面能显示内容的时候，会触发domcontentloaded，不会等待图片等资源加载
5.在图片等资源都加载完成后，才会触发load
输入URl后发生的事http://www.dailichun.com/2018/03/12/whenyouenteraurl.html
从浏览器接收url到开启网络请求线程（这一部分可以展开浏览器的机制以及进程与线程之间的关系）
开启网络线程到发出一个完整的http请求（这一部分涉及到dns查询，tcp/ip请求，五层因特网协议栈等知识）
从服务器接收到请求到对应后台接收到请求（这一部分 ...
手撕系列
JavaScript：原生JS实现图片懒加载获取当前页面滚动条纵坐标的位置scrollTop
1var heightTop = document.documentElement.scrollTop || document.body.scrollTop;
实现代码
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>LazyLoad</title> <style type="text/css"> *{ margin:0; padding: 0; list-style: none; } #list i ...
面试笔记-1
H5新特性
语义特性
易于用户阅读；样式丢失的时候能让页面呈现清晰的结构
有利于SEO，搜索引擎根据标签来确定上下文和各个关键字的权重 方便其他设备解析，如盲人阅读器根据语义渲染网页 有利于开发和维护，
语义化更具可读性，
代码更好维护
本地存储特性
设备访问的特性
连接特性
网页多媒体特性
三维、图形以及特效特性
性能与集成特性
display和visibledisplay: none —不为被隐藏的对象保留其物理空间，即该对象在页面上彻底消失，通俗来说就是看不见也摸不到。
display: none—-将元素的显示设为无，即在网页中不占任何的位置。
visible: hidden— 使对象在网页上不可见，但该对象在网页上所占的空间没有改变，通俗来说就是看不见但摸得到。
visibility: hidden—-将元素隐藏，但是在网页中该占的位置还是占着。
隐藏方法：opacity: 0透明度调为0和visibility: hidden一样
跨域浏览器同源策略：协议名、域名、端口号必须一致；当页面在执行一个脚本时,会检查访问的资源是否同源,如果不是,就会报错。
注意：对于像 ...
js中的==和===区别、相等操作符
js中有两组关于相等的操作符，第一组是等于和不等于，他们在比较之前先执行转换；第二组是全等和不全等，他们比较前不执行转换。
等于和不等于
等于：==
不等于：!=
这两个操作符都会先进行类型转换（强制类型转换）再确认操作数是否是相等。
在其转换时会遵循如下规则：
如有操作数为布尔值，则会将其转换为数值在进行比较。false为0，true为1。
若一个操作数是字符串，另一个操作数是数值，则会尝试将字符串转换为数值再比较。
若一个操作数是对象，另一个不是，则会使用valueOf()方法获取其原始值，然后再根据前面的方法来比较。
在比较是遵循如下规则：
null和undefined相等
null和undefined不会转换为其他类型的值再进行对比
如果有任意操作数为NaN，则比较都会是不相等。即使两个操作数都是NaN，相等操作符也是false，按照规则，NaN不等于NaN。
如果两个操作数都是对象，则比较它们是不是同一个对象，如果都是指向同一个对象，则相等操作符返回true。
全等和不全等
全等：===
不全等：!==
这组操作符就是严格运算符，会严格的比较两者的类型和数值。 ...
js的array数组的join()方法
之前关于组合数组元素一直用着很蠢的for(let i of array)来循环组合出数组中的元素，然后知道做题才发现有个数组内置的join方法可以方便的解决之前的操作。
123456789101112131415161718192021222324// 1、将数组中每个元素转换成字符串const num = ['q', 'we', 'r'];console.log(num.join());// 结果： q,we,r// 2、将数组中每个元素组合拼接在一起console.log(num.join(""));// 结果：qwer// 3、各元素中间加上间隔console.log(num.join(" "));// 结果：q we rconsole.log(num.join("|"));// 结果：q|we|r// 4、判断数组是不是空字符数组，根据返回的是否为空白就可以判断是不是空字符数组const num1 = [,,,,,]console.log(num1.join( ...
vue是啥
Vue是什么？
Vue是一套用于构建用户界面的渐进式框架，Vue 被设计为可以自底向上逐层应用，Vue的核心是只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。
vue.js的两大核心：数据驱动、组件系统
数据驱动：在vue中，数据的改变会驱动视图的自动更新。传统的做法是需要手动改变DOM来使得视图更新，而vue只需要改变数据。
组件系统:组件化开发，优点很多，可以很好的降低数据之间的耦合度。将常用的代码封装成组件之后，就能高度的复用，提高代码的可重用性。一个页面/模块可以由多个组件所组成。
渐进式框架就是一步一步渐进的意思，在使用vue的时候不要求把框架所有东西都用上。就可以先把vue核心库里的东西声明式渲染和组件系统给先用上，然后至于其他的客户端路由（router）、状态管理（vuex）、构建工具（vue-cli），你可以选择是否要使用上这些东西来开发你的程序，不一定全都要一起用着。
自底向上逐层应用就可以字面意思理解，先写好基层，然后逐步逐层添加东西，就和搭积木一样。
MVVMvue是个根据mvvm（Model-View-ViewModel ）框架设计的库， ...
emmet语法的使用
id指令:# ; class指令:.12345//div#test<div id="test"></div>//div.test<div class="test"></div>
子节点指令:> ; 兄弟节点指令:+ ; 上级节点:^div>ul>li>p
1234567<div> <ul> <li> <p></p> </li> </ul> </div>
div+ul+p
123<div></div><ul></ul><p></p>
ul>li^div
123456<div> <ul> <li> </li> </ul> </div>
重复（*）div*3
123< ...
Vue笔记整合(下)
Vue学习(8)-vue-router、Promise的学习一、vue-router学习路由的传值
URL：
协议://主机:端口/路径？查询
scheme://host:post/path?query#fragment
12345678<router-link :to="{path: '/profile'}, query: {name: 'why', age: 18, height: 1.88}">档案</router-link><h2> {{$route.query}}</h2><h2> {{$route.query.name}}</h2>
12345678910111213141516171819202122<buutton @cilck="profileClick">档案</buu ...
Vue笔记整合(中)
vue学习(4)–响应式数组、JavaScript高阶函数、v-model双向绑定一、响应式数组12345678910111213141516171819202122btnClick() { //1、push()在数组结尾加上数据 this.name.push('aa', 'bb','cc'); //2、pop()删除数组的最后一个元素 this.name.pop(); //3、shift()删除数组中的第一个元素 this.name.shift(); //4、unshift()在数组最前面添加元素 this.name.unshift(); //5、splice(从哪个位置开始，要删除几个，‘要添加替换的元素’) //若为输入第二个参数数则删除后面所有元素 //若要插入元素时，就输入第二个参数为0，后面跟上要加上的数字 this.name.splice(1, 2, 'a', 'b'); //6、reverse()将数组内容反转 this.name. ...
Vue笔记整合(上)
vue学习(1)–引入、小实例、mvvm、生命周期Vue 是一套用于构建用户界面的渐进式框架。编程范式：声明式编程。
一、引入1<script src="vue.js的地址"></script>
二、小实例建一个简单Vue应用：1234567891011<div id="app">{{ message }}</div><script src="vue.js的地址"></script><script> const app = new Vue({ el: '#app', data: { message: 'Hello Vue!' } })</script>
在es6里面定义const(常量)/let(变 ...