DOM 可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构。
W3C 中将 DOM 标准分为 3 个不同的部分：核心 DOM、XML DOM 和 HTML DOM。其中，核心 DOM 是针对任何结构化文档的标准模型，XML DOM是针对文档的标注模型，而 HTML DOM是针对 HTML 文档的标准模型。
HTML DOM模型被狗仔为对象的树，该树的根节点是文档（Document）对象，该对象有一个documentElement 的属性引用，表示文档根元素的 Element 对象。 HTML 文档中表示文档根元素的 Element 对象是 <html> 元素，<head> 和 <body>元素可以看作数的枝干。
一个文档中所有的节点关系分为 3 种，具体如下。
（1）、直接位于一个节点之下的节点被称为该节点的子节点（childNode）
（2）、直接位于一个节点之上的节点被称为该节点的父节点（parent Node）
（3）、具有相同父节点的两个节点称为兄弟节点（siblingNode）
在开发中，想要操作页面上的某个部分，例如控制一个 div 的显示或隐藏等，需要先获取到该部分对应的元素，再对其进行操作。
1.节点的访问：
在 DOM 中，HTML 文档的各个节点被视为各种类型的 Node 对象。通过某个节点的子节点可以找到该元素，其语法如下：
父节点对象 = 子节点对象.parentNode;
Node 对象的常用属性如表：
| 属性 | 类型 | 描述 |
| parentNode | Node | 返回节点的父节点，没有父节点时为 null |
| childNode | NodeList | 返回节点到子节点的节点列表 |
| firstChild | Node | 返回节点的首个子节点，没有则为 null |
| lastChild | Node |
返回节点的最后一个子节点，没有则为 null |
2.获取文档中的指定元素：
通过遍历节点可以找到文档中指定的元素，但是这种方法有些麻烦，document 对象提供了直接搜索文档中指定元素的方法，具体如下：
（1）通过元素的 id 属性获取元素：
Document 的 getElementById（）方法可以通过元素的 id 属性获取元素。例如，获取 id 属性值为 userId 节点的代码如下：
document.getElementById("userId");
（2）通过元素的 name 属性获取元素：
Document 的 getElementByName（）方法可以通过 name 属性获取元素。因为多个元素可能有相同的 name 值，所以该方法返回值为一个数组，而不是一个元素。如果想获得具体的元素，可以通过数组索引实现。例如，获取 name 属性值为 userName 节点的代码如下：
document.getElementByName("userName")[0];
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
