一、什么是DOM树？
DOM （Document Object Model）是指文档对象模型，通过它，可以访问HTML文档的所有元素。
DOM树是结构，所谓层级结构是指元素和元素之间的关系：父子，兄弟。
文档：DOM中的"D"
如果没有document（文档），DOM也就无从谈起。当创建了一个网页并把它加载到Web浏览器中时，DOM就在幕后悄然而生了。它把你编写的网页文档转换成为一个文档对象。
对象：DOM中的"O"
对象（object）是一种非常重要的数据类型。对象是自包含的数据集合，包含在对象里的数据可以通过两种形式访问——属性和方法。
模型：DOM中的"M"
DOM中的“M”代表着“Model”（模型），它的含义是某种事物的表现形式，DOM代表着加载到浏览器窗口的当前网页。浏览器提供了网页的模型，而我们可以通过JavaScript去读取这张地图。
二、HTML DOM树
DOM标准规定HTML文档中的每个成分都是一个节点(node)：
- 文档节点(document对象)：代表整个文档
- 元素节点(element 对象)：代表一个元素（标签）
- 文本节点(text对象)：代表元素（标签）中的文本
- 属性节点(attribute对象)：代表一个属性，元素（标签）才有属性
- 注释是注释节点(comment对象)
三、对节点的增删改查
为节点添加事件的方法:
<node>.onclick = function() {};如何获得节点
//获得页面中指定id的节点对象
节点对象 document.getElementById（"id的字符串"）//获得页面中所有标签名符合要求的标签
节点集合 document.getElementsByTagName("标签名")//获得指定父节点下的所有名字符合要求的结点
节点集合 父节点.getElementsByTagName("标签名")//属性
<node>.childNodes
<node>.firstChild
<node>.lastChild
修改节点（修改节点的属性与包含的文本）
//修改属性的标准方法（DOM-Core）
<node>.setAttribute("属性名"，"值")；
文本 <node>.getAttribute("属性名")；//修改内容
<node>.innerHTML//修改样式
<node>.style.样式属性 = "值"；创建节点
//元素节点
var node= document.createElement("标签名")；//文本节点
var textNode= document.createTextNode("文本")；
//这里可以使用html
<节点>.innerHTML = "文本"；
//非标准
<节点>.innerText = "文本"；
document.write();//属性节点
<节点>.setAttribute(...,...);添加节点
//添加到尾部
<parentNode>(父节点).appendChild(<subNode>)；
//插入到中间（插入到某一个元素的前面）
<parentNode>.insertBefore(<newSubNode>，<nextNode>)；删除节点
父节点.removeChild(子节点)；//隐藏
p(标签名).style.diaplay = "none"四、DOM的常用事件
//页面加载完毕时触发
onload//页面卸载时触发
onunload//页面卸载前触发
onbeforeunload
