使用javascript获取任何<ul>中<li>的数量

Question

我有一个代码，我需要在其中找到li标签的数量，而不是嵌套的。

<ul class="ulStart">
   <li>
      <ul class="ulNested">
         <li></li>
         <li></li>
      </ul>
  </li>
  <li></li>
</ul>

正在做

document.querySelector('.ulStart').getElementsByTagName('li')

给了我4 <li>，这是不是我想要的，我想要的号码li出现在标签ulStart。让我知道是否有任何方法可以这样做。没有 jQuery，纯 javascript。

Answer 1

let count = document.querySelectorAll("ul.ulStart > li").length;
console.log(count);

<ul class="ulStart">
  <li>
    <ul class="ulNested">
      <li></li>
      <li></li>
    </ul>
  </li>
  <li></li>
</ul>

使用>（直接子级）CSS 选择器。请参阅MDN-子选择器。