HTML | DOM childNodes 属性介绍

在HTML中， DOM childNodes 属性返回一个节点的所有子节点，作为 NodeList 对象。子节点包括元素节点、文本节点以及其他类型的节点。该属性是只读的。

该属性返回的 NodeList 对象是动态的，意思是当添加或删除了节点时，返回的 NodeList 对象也会被自动更新。

语法

node.childNodes 

其中，node 指要返回子节点的节点。

返回值

返回一个 NodeList对象，其中包含指定节点的所有子节点。

示例

例如，如果我们有以下HTML代码：

<div id="test">
  <p>这是一个段落。</p>
  <button>按钮</button>
  这是一段文本。
</div>

我们可以使用以下JavaScript代码来获取div元素的所有子节点：

let test = document.getElementById("test"); // 获取div元素
let childNodes = test.childNodes; // 获取div元素的所有子节点

结果将是一个包含3个元素的NodeList对象，即两个元素节点（p和button）和一个文本节点。

注意事项

需要注意的是， childNodes 属性会返回所有类型的节点。如果您只想返回元素节点，请使用 children 属性。另外，文本节点也是子节点，因此在使用该属性时需要小心。最好使用 nodeType 属性检查子节点的类型。

总之， DOM childNodes 属性是一个非常有用的属性，可用于查找节点的所有子节点，并对它们进行进一步操作。