jQuery计数子元素

<div id="selected"> <ul> <li>29</li> <li>16</li> <li>5</li> <li>8</li> <li>10</li> <li>7</li> </ul> </div> 

我想要计算<div id="selected"></div>中<li>元素的总数。 这怎么可能使用jQuery的.children([selector]) ？

Answer 1

你可以使用.length只有一个后代select器 ，如下所示：

 var count = $("#selected li").length; 

如果你必须使用.children() ，那么就是这样的：

 var count = $("#selected ul").children().length; 

你可以在这里testing两个版本 。

Answer 2

 $("#selected > ul > li").size() 

要么：

 $("#selected > ul > li").length 

Answer 3

最快的一个：

 $("div#selected ul li").length 

Answer 4

 var length = $('#selected ul').children('li').length // or the same: var length = $('#selected ul > li').length 

您可能也可以在孩子的select器中省略。

参见.length 。

Answer 5

你可以使用JavaScript（不需要jQuery）

 document.querySelectorAll('#selected li').length; 

Answer 6

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

甚至更好

  $('#selected li').length; 

Answer 7

childElementCount在纯JavaScript中是完全可能的

 var countItems = document.getElementsByTagName("ul")[0].childElementCount; console.log(countItems); 

 <div id="selected"> <ul> <li>29</li> <li>16</li> <li>5</li> <li>8</li> <li>10</li> <li>7</li> </ul> </div>