本章内容
- 理解包含不同层次节点的DOM
- 使用不同的节点类型
- 克服浏览器兼容问题及各种陷阱
什么是DOM？
DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口)。 DOM描绘了一个层次化的节点树，允许开发人员添加、移除和修改页面的一部分。 1998年10月DOM1级规范成为W3C的推荐标准，为基本的文档结构和查询提供了子接口。
什么是节点？
节点是DOM的基础概念，表示文档中一个相对独立的组成部分。
节点层次
DOM可以将任何HTML和XML文档描绘成一个有多层节点构成的结构。节点分为几种不同的类型，每种类型表示文档中不同的信息及(或)标记。每个节点都有各自的特点、数据和方法，另外和其他节点存在某种关系。节点之间的关系构成了层次，而所有页面标记则表现为一个特定节点为根节点的树形结构。
文档中所有的节点之间都存在这样或那样的关系，为了便于记忆理解，我们使用传统家族关系来类比。按照家族族谱来看节点层次，有着并列、嵌套两种关系，对应到节点层次上面，就是同胞节点与父子节点。
既然有了层次结构，那么我们需要某种方式去判断节点之间的关系，那就是节点的相关属性。每个节点都有一个childNodes属性，其中保存着一个NodeList对象。NodeList是一个类数组对象，用于保存一组有序的节点，可以通过位置来访问这些节点。请注意，虽然可以通过方括号语法来访问NodeList的值，并且这个对象也具有length属性，但是NodeList并不是Array的实例。
NodeList对象的独特之处在于，它实际上是基于DOM结构动态执行查询的结果，因此DOM结构的变化能够自动反映在NodeList对象中。我们常说，NodeList是有生命、有呼吸的对象，而不是在我们第一次访问它们的某个瞬间拍摄下来的一张快照。
此外，还有parentNode属性，previousSibling属性，nextSibling属性，firstChild属性和lastChild属性。
节点类型
每一段标记都可以通过树中的一个节点来表示：HTML元素通过元素节点表示，特性(attribute)通过特性节点表示，文档类型通过文档类型节点表示，而注释则通过注释节点表示。总共有12种节点类型，每种类型都对应着一个常量与数值。这些类型都继承自一个基类型，因此所有类型的节点都共享着一些基本属性和方法。
如何判断节点类型？
每个节点都有一个nodeType属性，用于表示节点的类型。节点类型由在Node类型中定义的12个数值常量来表示(每个常量分别对应着1-12中的一个数值)，任何节点类型必居其一。然而，由于IE没有公开Node类型的构造函数，因此在判断节点类型时，为了确保跨浏览器兼容，最好还是讲nodeType属性与数字值进行比较，而不是常量类型(如Node.ELEMENT_NODE)。
Node类型
DOM1级定义了一个Node接口，该接口将由DOM中的所有节点类型实现。这个Node接口在JS中是作为Node类型实现的。 而Node类型就是上面所说的所有类型节点继承的基类型。它是最基本的节点类型，用于抽象地表示文档中一个独立的部分，所有其他类型节点都继承自Node。 除了IE外，在其他所有的浏览器都可以访问到这个类型。因为JS中所有的节点类型都继承自Node类型，因此所有节点类型都共享着一些基本属性和方法。
共享的基本属性和方法？
nodeType，nodeName，nodeValue，childNodes，parentNode，previousSibling，nextSibling，firstChild，lastChild，ownerDocument
hasChildNodes()
appendChild()，insertBefore()，replaceChild()，removeChild()。这四个方法操作的都是某个节点的子节点，但并不是所有节点都有子节点。在不支持子节点的节点上调用这些方法，将会导致错误发生。
cloneNode()，接受一个布尔值参数，表示是否执行深复制。
normalize()
根节点
文档节点是每个文档的根节点。 并不是所有节点类型都受到Web浏览器的指出，开发人员最常用的就是元素和文本节点。
document.createElement(“style”)，document.createTextNode(“body{background:red}”)
什么是动态脚本？
这里要讨论的动态脚本，指的是页面加载时不存在，但将来的某个时候通过修改DOM动态添加的脚本。 使用
