如何使用 javascript 计算具有特定类的父节点的所有子节点

Question

最好在javascript中。例如：

    <div id="parent">
      <div class="one"></div>
      <div class="one"></div>
      <div class="one"></div>
      <div class="two"></div>
      <div class="two"></div>
    </div>

如何计算类"一"(3( 的子元素的数量？谢谢。

Answer 1

您可以使用 querySelectorAll。

返回文档中与指定的选择器组匹配的元素列表(使用文档节点的深度优先预序遍历(。

---

选择器是包含一个或多个以逗号分隔的 CSS 选择器的字符串。

您可以在此处引用所有CSS选择器。

在这种情况下#parent > .one将搜索具有类 one 的元素，这些元素是 id parent 的元素的直接子级。

var count = document.querySelectorAll("#parent > .one").length;
console.log(count);

<div id="parent">
  <div class="one"></div>
  <div class="one"></div>
  <div class="one"></div>
  <div class="two"></div>
  <div class="two"></div>
</div>