节点层级
- 任何 HTML 或 XML 文档都可以用 DOM 表示为一个由节点构成的层级结构。
- document 节点表示每个文档的根节点。在这里,根节点的唯一子节点是 元素,我们称之为文档元素( documentElement )。文档元素是文档最外层的元素,所有其他元素都存在于这个元素之内。每个文档只能有一个文档元素。在 HTML 页面中,文档元素始终是 元素。在 XML 文档中,则没有这样预定义的元素,任何元素都可能成为文档元素。
- DOM 中总共有 12 种节点类型,这些类型都继承一种基本类型。
Node 类型
节点类型
| 节点类型 | 说明 |
|---|---|
| Node.ELEMENT_NODE(1) | element元素节点 |
| Node.ATTRIBUTE_NODE(2) | attribute属性节点 |
| Node.TEXT_NODE(3) | text文本节点 |
| Node.CDATA_SECTION_NODE(4) | cdata_section节点 |
| Node.ENTITY_REFERENCE_NODE(5) | entity_reference实体引用节点 |
| Node.ENTITY_NODE(6) | entity实体节点 |
| Node.PROCESSING_INSTRUCTION_NODE(7) | processing_instruction处理指令节点 |
| Node.COMMENT_NODE(8) | comment注释节点 |
| Node.DOCUMENT_NODE(9) | document文档节点 |
| Node.DOCUMENT_TYPE_NODE(10) | document_type文档类型节点 |
| Node.DOCUMENT_FRAGMENT_NODE(11) | document_fragment文档片段节点 |
| Node.NOTATION_NODE(12) | notation标记节点 |
节点属性
| 节点属性名称 | 说明 |
|---|---|
| Node.nodeType | 属性可用来区分不同类型的节点, 1、元素节点就是标签,3、文本节点,8、注释节点 |
| Node.nodeName | 获取元素的标签名称,先判断是否为元素类型 |
| Node.nodeValue | nodeValue 则始终为 null |
| Node.childNodes | 返回包含指定节点的子节点的集合,该集合为即时更新的集合 |
| Node.parentNode | 返回父节点 |
| node.baseURI | 是只读属性,返回一个节点的绝对基址 URL |
| node.baseURIObject | 返回一个代表当前节点(通常是文档节点或元素节点)的基URL的nsIURI对象.该属性类似与Node.baseURI,只是它返回的是一个包含更多信息的nsIURI对象,而不只是一个URL字符串. |
| node.firstChild | 只读属性返回树中节点的第一个子节点,如果节点是无子节点,则返回 null。 |
| Node.isConnected | 返回一个布尔值用来检测该节点是否已连接(直接或者间接)到一个上下文对象上 |
| Node.lastChild | 返回节点的最后一个子节点。 |
| Node.nextSibling | 返回节点之后紧跟的同级节点。 |
| Node.ownerDocument | 返回节点的根元素(document 对象)。 |
| Node.parentElement | 返回一个当前节点的父节点 Element 。 如果当前节点没有父节点或者说父节点不是一个元素(Element), 这个属性返回null。 |
| Node.previousSibling | 返回一个当前节点同辈的前一个节点( Node) ,或者返回null(如果不存在这样的一个节点的话)。 |
| Node.textContent | 属性设置或者返回指定节点的文本内容 |
| node.attributes | 返回指定节点属性的集合 |
节点方法
| 节点方法名称 | 说明 |
|---|---|
| Node.appendChild() | 将指定的 childNode 参数作为最后一个子节点添加到当前节点。 |
| Node.cloneNode() | 克隆一个 Node,并且可以选择是否克隆这个节点下的所有内容。默认情况下,节点下的内容会被克隆。 |
| Node.compareDocumentPosition() | 比较当前节点与文档中的另一节点的位置。 |
| Node.contains() | 返回一个 Boolean 布尔值,来表示传入的节点是否为该节点的后代节点。 |
| Node.getRootNode() | 返回上下文对象的根节点。如果shadow root节点存在的话,也可以在返回的节点中包含它。 |
| Node.hasChildNodes() | 返回一个Boolean 布尔值,来表示该元素是否包含有子节点。 |
| Node.insertBefore() | 在当前节点下增加一个子节点 Node,并使该子节点位于参考节点的前面。 |
| Node.isDefaultNamespace() | 返回一个 Boolean 类型值。接受一个命名空间 URI 作为参数,当参数所指代的命名空间是默认命名空间时返回 true,否则返回 false。 |
| Node.isEqualNode() | 返回一个 Boolean 类型值。当两个 node 节点为相同类型的节点且定义的数据点匹配时(即属性和属性值相同,节点值相同)返回 true,否则返回 false。 |
| Node.isSameNode() | 返回一个 Boolean 类型值。返回这两个节点的引用比较结果。 |
| Node.lookupPrefix() | 返回包含参数 URI 所对应的命名空间前缀的 DOMString,若不存在则返回 null。如果存在多个可匹配的前缀,则返回结果和浏览器具体实现有关。 |
| Node.lookupNamespaceURI() | 接受一个前缀,并返回前缀所对应节点命名空间 URI 。如果 URI 不存在则返回 null。传入 null 作为 prefix 参数将返回默认命名空间。 |
| Node.normalize() | 对该元素下的所有文本子节点进行整理,合并相邻的文本节点并清除空文本节点。 |
| Node.removeChild() | 移除当前节点的一个子节点。这个子节点必须存在于当前节点中。 |
| Node.replaceChild() | 对选定的节点,替换一个子节点 Node 为另外一个节点。 |