DOM文档对象模型
HTML中每个内容（标签、文本内容、属性）都是一个节点对象Node。
node（节点）的属性
三大属性：
1、nodeType节点类型
专门区分节点的类型：
document 9
element 1
attribute 2
text 3
2、nodeName节点名称
document #document
element 全大写的标签名
attribute 属性名
text #text
3、nodeValue节点值
null
null
属性
文本内容
DOM的操作之查找
查找：
1、直接获取的三个元素：
html document.documentElement
head .head
body .body
2、节点关系
父子关系：
node.parentNode 返回node的父节点
node.childNodes 返回Node的所有直接子节点
node.firstChild 返回node下第一个子节点
node.lastChild 返回node下最后一个子节点
兄弟关系：
node.previousSibling 返回当前节点前一个兄弟节点
node.nextSibling 获得当前节点后一个兄弟节点
不但包含有用的元素节点，还包含了看不见的换行、空格干扰。
下一种方法只获取节点信息：
父子关系：
elem.parentElement 返回一个父元素对象
.children 返回子元素对象的集合（IE8支持）
.firstElementChild 返回第一个子元素对象
.lastElementChild 返回最后一个子元素对象
兄弟关系：
.previousElementSibling 返回当前元素的前一个兄弟元素对象
. nextElementSibling 返回当前元素的下一个兄弟元素对象（IE9+）
按HTML查找
what？
在整个网页或指定父元素下，查找属性或标签符合要求的元素对象。
what？
只要是按照基本的条件有选择的查找元素。
四种方法：
1、通过id查找html元素
2、通过类名查找html元素
3、通过标签名查找html属性
4、通过元素的name属性查找html元素
按选择器查找：
按HTML查找每一次只能使用一个查询条件，选择器查找条件复杂的都可以查找。
1、仅查找一个元素：
var elem = 父元素.querySelector（“选择器”）；
2、查找多个元素：
var elem = 父元素.querySelectorAll（“选择器”）；
非动态！
鄙视题： getXXX vs SeletorAPI的差别是什么？ 如何选择？
1、返回值： getXXX 返回值：动态集合
SeletorAPI 返回值：非动态集合
2、效率： getXXX 首次查询效率高
SeletorAPI 首次查询效率低
3、易用： getXXX 条件复杂是，更繁琐
SeletorAPI 更简单，因为繁琐的工作就交给了选择器
如果通过一个条件就可以得到元素时，首选getXXX；
如果条件复杂时，首选SeletorAPI
在JS中修改html：
DOM分两种，核心DOM，HTML DOM。
核心DOM：可以操作一切结构文档的API（HTML和XML）
优点：万能 缺点：繁琐
HTML DOM：对核心DOM中常用的API的简化
优点：简单 缺点：不是万能，只有对部分API的简化
视情况而定使用哪种方法，优先用简单的。
核心DOM访问属性：
获得属性值：var value = elem.getAttribute("属性名");
修改属性值：elem.setAttribute("属性名","属性值");
判断是否包含属性：var bool != elem.hasAttribute("属性名");
移除属性：elem.removeAttribute("属性名");
HTML DOM属性：
elem.属性名;
elem.属性名 = "属性值";
elem.属性名 != ""; //判断是否为空则判断是否包含属性
elem.属性名 = ""; //属性名设为空则删除