DOM（核心）（重点）
1. 什么是DOM
文档对象模型（ Document Object Model ，简称DOM），是W3C推荐的处理可扩展标记语言（ HTML或者XML ）的标准编程接口。
W3C已经定义了一系列的DOM接口，通过这些DOM接口可以改变网页的内容，结构和样式。
- 对于JavaScript，为了能够使JavaScript操作HTML，JavaScript就有了一套自己的 dom 编程接口。
- 对于HTML，dom使得html形成了一棵dom树，包含文档， 元素， 节点
- 文档：一个页面就是一个文档，DOM中使用 document 表示
- 元素：页面中的所有标签都是元素，DOM中使用 element 表示
- 节点：网页中的所有内容都是节点（标签，属性，文本，注释等），DOM中使用node表示
- 我们获取的DOM元素是一个对象（object），所以称为文档对象模型
2. 关于dom操作，我们主要针对元素的操作，主要有创建，增，删，改，查，属性操作，事件操作
2.1 创建
- document.write()
- element.innerHTML
- document.createElement()
2.2 增
- 父级.appendChild(变量);
- 父级.insertBefore(变量, 父级.children[n])
2.3 删
- removeChild
2.4 改
2.5查
- DOM 提供的API的方法：getElementById, getElementByTagName 古老用法不推荐
- H5提供的新方法：qureySelector， qureySelectorAll 提倡
- 利用节点操作获取元素：父（parentNode），子（children），兄（previousElementSibling，nextElementSibling）提倡
2.6 属性操作（自定义）
| 方法 | 作用 |
|---|---|
| element.getAttribute(‘属性’) | 主要获得自定义的属性（标准） |
| element.setAttribute(‘属性’, ‘属性值’) | 自定义属性 |
| element.removeAttribute(‘属性’); | 移除属性 |
2.7 事件操作（基础的，不全）
给元素注册事件，采取 事件.事件类型=事件处理程序
| 鼠标事件 | 触发条件 |
|---|---|
| onclick | 鼠标点击左键触发 |
| onmouseover | 鼠标经过触发 |
| onmouseout | 鼠标离开触发 |
| onmousemove | 鼠标移动触发 |
| onmouseenter | 鼠标经过触发 |
| onmouseleave | 鼠标离开触发 |
| onfocus | 获得鼠标焦点触发 |
| onblur | 失去鼠标焦点触发 |
| onmouseup | 鼠标弹起触发 |
| onmousedown | 鼠标按下触发 |