js学习笔记1

DOM：

文档对象模型，把文档当作对象，主要操作页面元素，顶级对象是document

1.innerHTML和createElement()创建多个元素谁的效率更高？
innerHTML如果采用拼接字符串的方法创建效率会低很多，如果用数组形式拼接（即join）效率比createElement()高，createElement()结构更清晰。document.write()会导致网页重绘，因此不建议使用。

2.传统注册事件onclick和事件监听addEventListener的区别？
前者只能添加一个，后者对一个事件可以添加多个不同的处理函数，但是有兼容性问题。

3.对象事件中的e.target和this输出有什么区别？
e.target返回的是触发事件的对象（元素），this返回的是绑定事件的对象。

4.阻止事件冒泡的两种方法
e.stopPropagation(); // stop 停止 Propagation 传播
window.event.cancelBubble = true; // 非标准 cancel 取消 bubble 冒泡

5.事件委托的原理—事件冒泡的应用
不给每个子节点单独设置事件监听器，而是将事件监听器设置在其父节点上，然后利用冒泡原理影响设置每个子节点。
（利用e.target可以获得点击的对象）
优势：
①不用使用for循环给每个子节点都添加事件。②对于动态添加的元素也可以执行事件。

BOM：

浏览器对象模型，将浏览器当作对象，主要是浏览器窗口交互的一些对象，顶级对象是window

1.在AddEventListner中使用’load’和‘DOMContentLoaded’的区别？
load事件等页面内容全部加载完毕后（包括页面dom元素，图片，flash，css等）执行。
DOMContentLoaded事件是DOM加载完毕后（不包含图片，flash，css等）就可以执行，加载速度更快。

jQuery

1.jQuery 对象和 DOM 对象的区别？
使用 jQuery 方法和原生JS获取的元素是不一样的 :
（1）用原生 JS 获取来的对象就是 DOM 对象
（2）jQuery 方法获取的元素就是 jQuery 对象。
（3）jQuery 对象本质是： 利用$对DOM 对象包装后产生的对象（伪数组形式存储）。

2.隐式迭代
遍历内部DOM元素（伪书组形式存储）的过程，即把匹配的所有元素内部进行遍历循环。

3.浅拷贝与深拷贝
浅拷贝目标对象引用被拷贝的对象地址，修改目标对象会影响被拷贝对象。深拷贝为完全克隆（拷贝的是对象，不是地址），修改目标对象不会影响被拷贝对象。

其他:

1.定义全局变量还不赋值的时候可以先写null即空对象。

2.全局对象和普通函数、定时器中的this指向window，对象中的this指向对象

3.js执行机制：
js中分为同步任务和异步任务，回调函数都放在了异步任务中
（1）先执行执行栈中的同步任务，（2）在满足回调函数的条件时，将异步任务（回调函数）放入任务队列中，（3）一旦所有执行栈中的同步任务执行完毕，系统按次序读取任务队列中的异步任务，于是被读取的异步任务结束等待状态，进入执行栈，开始执行。

4.offset和style使用区别：
offsetWidth是只读属性，style.width是可读写属性。因此，想要获取元素大小位置，用offset更合适。想给元素更改值，则需要用style改变。

5.元素被卷取的头部是element.scrollTop，如果是页面被卷去的头部则是window.pageYOffset。

6.mouseover和mouseenter的区别？
mouseover经过自身盒子喝子盒子都会触发，mouseenter经过自身盒子会触发，经过子盒子不会触发，因为它不会冒泡

7.需要注意在用除法的时候，结果的小数可能会造成影响。

8.节流阀：
目的：
当上一个函数动画内容执行完毕，再去执行下一个函数动画，让事件无法连续触发。
核心实现思想：
利用回调函数，添加一个变量来控制，锁住函数和解锁函数。

9.本地存储中，sessionStorage和localStorage的区别：
生命周期不同。
sessionStorage刷新页面数据不会丢失，但是关闭页面后所有数据都会丢失。
localStorage无论是刷新页面还是关闭页面，数据都会保存在本地，而且可以在同一浏览器（google）多页面共享数据。