使用Javascript按className或querySelectorAll获取所有子元素

Question

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

我想使用相同的className来获取所有div内的所有HTML元素，但重要的是它们都应属于同一集合，数组或任何允许我循环遍历的元素。

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

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

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

它可以工作，但是我想知道是否有直接的方法，例如访问同一代码行上的两个索引？

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>