如何计算具有某个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>

如何计算类“one”（3）的子元素数量？谢谢。

Answer 1

您可以使用querySelectorAll。

  

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

<小时/>   selectors是一个字符串，包含一个或多个用逗号分隔的CSS选择器。

您可以引用所有CSS选择器here。

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

＆＃13;

＆＃13;

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

＆＃13;

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

＆＃13;

＆＃13;

＆＃13;