Question

如何从DOM元素中获取所有子元素，而不仅仅是直接子元素并使用JavaScript返回它们？

Answer 1

假设您想要获取DOM元素的所有后代，可以在CSS选择器中使用*：

#elem *
.className *
div *

例如，您可以使用vanilla JS提取elem元素的所有后代：

document.querySelectorAll('#elem *')

或jQuery

$('#elem *')

演示：（结果显示在控制台中）

＆＃13;

[].forEach.call(document.querySelectorAll('#elem *'), function(x) {
  console.log(x);
});

＆＃13;

<div id="notAnElem">
  <a></a>
  <i></i>
</div>

<div id="elem">
  <div>
    <a></a>
  </div>
  <i></i>
</div>

All descendants of `elem` should appear in console

＆＃13;

Answer 2

您可以使用：

如果整个身体 -

var c = document.body.childNodes;

如果某个DIV -

var c = document.getElementById("myDIV").childNodes

以上还将包括文本节点和注释节点

如果您只需要元素节点，请使用此 -

var c = document.body.children;

注意：以上所有变量都是元素集合，以后可以使用for循环进行迭代，并以'c.length'作为限制。

使用JavaScript返回DOM元素的所有子元素

2 个答案: