DOM

什么是DOM？

首先，什么是DOM？DOM是Document Object Model（文档对象模型）的缩写，是专门操作HTML的API。众所周知，DOM包含核心DOM、XML DOM和HTML DOM，核心DOM能够直接操作所有的结构化文档（html，xml），是中立与平台和语言的接口，它允许程序或脚本动态地访问更新文档的内容、样式以及结构。DOM包含核心DOM、XML DOM和HTML DOM，我们这里讨论HTML DOM，HTML DOM是关于如何获取、添加、修改和删除HTML元素的标准。
W3C已经定义了一系列的DOM接口，通过这些DOM接口可以改变网页的内容、结构和样式。

节点

在HTML DOM中HTML文档中所有内容都被视为节点，DOM被视为节点树的HTML。

（1）整个文档视为一个文档节点

（2）每个HTML元素视为元素节点 //节点类型都有对应的数值 这里的是 1

（3）HTML元素中的文本视为文本节点 //文本节点text 所代表的数值为 3

（4）每个HTML属性为属性节点 //属性节点所代表的数值为 2

（5）注释为注释节点 //注释节点 coment 所代表的数值为 8

（6）document //这里代表的数值为 9

（7）DocumentFragment //这里代表的数值为 11

讲到这里属性节点代表的数值，就要提到它的作用 ，这是类似查看数据类型的 typeof 的效果所返回的值，用nodeType来实现。
节点属性还有 nodeName 用来获取元素的标签名，返回的内容均为大写，并且有个只读不能写入的属性。
nodeValue 是元素的内容，需要特别注意的是这个属性只对text文本节点与coment注释节点起作用，并且可读可写入。
hasCildNodes（）是判断是否含有子节点属性。
attributes 为节点的属性集合、类数组
例：div.attributes =》 {0：id，1：class，id：id，class：class，length：2}
HTML DOM将HTML视为文档视为树结构，这种结构称为节点树：
下面举个DOM树的图形示例

DOM树

DOM查找

dom的查找方式
1：var a = document.getElementById(“main”);
这里是id为main的标签 需要注意兼容问题（ie8）
2：var b = document.getElementsByTagName(“div”)[0];
这是第一个div标签 没有兼容问题
3： var c = document.getElementsByName(“inp”);
name属性为inp的标签
4： var d = document.getElementsByClassName(“top”);
这里是class为top的标签 推荐使用这种方式
再讲述一种类似css选择器的查找方式
5： var e = document.querySelector（".top span a"）;
还是兼容性问题 IE7及以下版本不兼容。