Dom&BOM

javascript的组成：

1.核心（ECMAScript）:描述了js的基本组成和语法

2.文档对象模型（DOM）: 处理网页对象的方法和接口

3.浏览器对象模型（BOM）：处理浏览器对象的方法和接口

BOM&DOM关键点

DOM根节点: 浏览器（window），node（global）；

window对象属性：document，location，navigator，history，screen，frames；

doucument子节点：forms,location,images,links

节点类型：

DOM规定文档中的每个成分都是节点（node），HTML是由节点组成的集合

1.元素节点

2.内容节点

3.属性节点

节点三大属性：

1.nodeName：

 元素节点：元素名称

 属性节点：属性名称

 文本节点：文本\#text的字符串

2.nodeType:

元素节点：1

属性节点：2

文本节点：3

3.nodeValue:

元素节点：null

属性节点：属性值

文本节点：文本内容

DOM常见操作

fisrtChild 第一个子节点

lastChild 最后一个子节点

childNodes 子节点列表

parentNode 父节点

previousSibling 相邻前一个节点

nextSibling 相邻后一个节点

hasChildNodes() 是否有子节点

attributes Element 节点的属性

appendChild(node) 添加子节点

removeChild(node) 移除子节点

replaceChild(newnode,oldnode) 替换子节点

insertBefore(newnode,refnode) 插入节点

innerText

innerHTML

outerText

outerHTML

获取节点

document.getElementById('id')

document.getElementsByName('li')

document.getElementsByTagName('p');

DOM事件

冒泡型事件和捕获型事件

冒泡型事件：从特定到不特定，即从里到外冒泡；

捕获型事件：从不特定到特定元素，即从外到内一层层捕获；

事件处理(监听)函数：addEventListener,removeEventListner,IE为attachEvent,detachEvent

鼠标事件：click，dbclick，mousedown，mouseup， mouseover，mouseout，mousemove ，tap（手机）

键盘事件：keydown，keypress，keyup 按顺序依次触发

HTML事件：load，unload，abort，error，select，change，submit，reset，resize，scroll，focus，blur

DOM 0级处理程序，例如div标签的onclick，或者js中的onclick监控事件

DOM 2级处理程序：addEventListener这种事件监听函数

innerHeight 返回窗口的文档显示区的高度

innerWidth 返回窗口的文档显示区的宽度

outerHeight 返回窗口的外部高度

outerWidth 返回窗口的外部宽度

pageXOffset 设置或返回当前页面相对于窗口显示区左上角的X位置

pageYOffset 设置或返回当前页面相对于窗口显示区左上角的Y位置

element.offsetHeight 返回元素的高度

element.offsetWidth 返回元素的宽度

element.offsetLeft 返回元素的水平偏移位置

element.offsetTop 返回元素的垂直偏移位置

element.offsetParent 返回元素的偏移容器

element.scrollHeight 返回元素的整体高度

element.scrollLeft 返回元素左边缘与视图之间的距离

element.scrollTop 返回元素上边缘与视图之间的距离

element.scrollWidth 返回元素的整体宽度

移动端触摸事件

ontouchstart

ontouchmove

ontouchend

ontouchcancel

页面加载流程:

defer和async的区别：