javascript - 使用 Javascript 通过 className 或 querySelectorAll 获取所有子元素

Question

我搜索了很多答案，但没有找到任何合适的解决方案。

我想获取所有具有相同类名的 div 中的所有 HTML 元素，但重要的是它们都属于同一个集合、数组或任何允许我遍历它的东西。

假设我有两个divs带有一个名为“divTest”的类，如果我使用querySelectorAll它来访问它，我将获得一个带有两个索引的 childList，第一个索引为 0，div第二个索引为 1。它会给我这些里面的所有元素divs，但它们不会在一起。我想一次访问两个索引。

我通过索引访问每个元素并将其放入一个数组中，并在其中传播两者：

submits = document.querySelectorAll(".divTest")[0].children;
submits1 = document.querySelectorAll(".divTest")[1].children;
arrayTeste = [...submits, ...submits1]

它有效，但我想知道是否有直接的方法可以做到这一点，比如访问同一代码行上的两个索引？

标签： javascripthtml

Answer 1

用于.divTest > *选择具有divTest类的元素的直接子元素的所有元素：

console.log(
  document.querySelectorAll('.foo > *').length
);

<div class="foo">
  <div></div>
  <div></div>
</div>
<div class="foo">
  <div></div>
  <div></div>
</div>