DOM
1.1什么是DOM
文档对象模型（Document Object Model，简称DOM），是 W3C 组织推荐的处理可扩展标记语言（html或者xhtml）的标准编程接口。
W3C 已经定义了一系列的 DOM 接口，通过这些 DOM 接口可以改变网页的内容、结构和样式。
DOM是W3C组织制定的一套处理 html和xml文档的规范，所有的浏览器都遵循了这套标准。
1.2. DOM树
- 文档：一个页面就是一个文档，DOM中使用document表示
- 节点：网页中的所有内容，在文档树中都是节点（标签、属性、文本、注释等），使用node表示
- 标签节点：网页中的所有标签，通常称为元素节点，又简称为“元素”，使用element表示
DOM把以上都称为对象
1.3. 获取元素
根据ID获取 document.getElementById(id)
作用：根据ID获取元素对象
参数：id值，区分大小写的字符串
返回值：元素对象 或 null
根据标签名获取元素 document.getElementsByTagName('标签名') 或者 element.getElementsByTagName('标签名')
作用：根据标签名获取元素对象
参数：标签名
返回值：元素对象集合（伪数组，数组元素是元素对象）
注意：getElementsByTagName()获取到是动态集合，即：当页面增加了标签，这个集合中也就增加了元素。
H5新增获取元素方式
获取body元素
doucument.body //返回body元素对象
获取html元素
doucument.documentElement //返回html元素对象
改变元素内容（获取或设置）
element.innerText
从起始位置到终止位置的内容，但它去除html标签，同时空格和换行也会去掉
element.innerHtml
起始位置到结束位置的全部内容，包括html标签，同时保留空格和换行
innerText和innerHTML的区别
-
获取内容时的区别：
innerText会去除空格和换行，而innerHTML会保留空格和换行
-
设置内容时的区别：
innerText不会识别html，而innerHTML会识别
常用元素的属性操作
-innerText、innerHTML 改变元素内容
-src、href
-id、alt、title
获取属性的值
元素对象.属性名
设置属性的值
元素对象.属性名 = 值
1.4自定义属性操作
-element.属性 获取属性值（元素本身自带的属性）
-element.getAttribute（‘属性’）；主要获取的自定义的属性
-element.removeAttribute('属性')移除属性
1.5DOM节点的操作
父级节点: node.parentNode
子节点：
parentNode.childNode（标准）
parentNode.firstChild 第一个子节点
parentNode.lastChild 最后一个子节点
parentNode.lastelementChild 最后一个子元素节点
创建节点
doucument.createElement（‘tagName’）
添加节点
node.appendChild（child）
node.insertBefore（child，指定元素）
删除节点
node.removeChild（child）
克隆节点
node.cloneNode（）
创建元素的三种方式
