javascript - 计算HTML列表中的直接子代

这是HTML标记的样子

<ul>
  <li>red</li>
  <li>green</li>
  <li>
  <ul>
       <li>banana</li>
       <li>pineapple</li>
       <li>peanut</li>
  </ul>
  </li>
  <li>blue</li>
  <li>
  <ul>
       <li>sun</li>
       <li>mars</li>
       <li>earth</li>
  </ul>
  </li>
  <li>orange</li>
</ul>

如何计算此列表中的直系子女（<li>）？ （包含红色，绿色，蓝色，橙色的项目）？

最佳答案

尝试这个：

$('ul > li').length;

'ul > li'选择器仅指向子级的第一级，即所有ul的直接子级。

要么

$('ul').children().length;

如果您的代码是字符串变量，例如

var html = '<ul><li>.....';

然后

$('ul > li', $(html)).length;

注意：上面的代码将找到所有

要仅查找li的第一级，请使用：

$('ul:not(li > ul)').children().length;

您还可以使用：

$('ul:not(li > ul) > li').length

对于html变量字符串：

$(html).children('ul > li').length;