дочерние элементы подсчета 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>

Я хочу подсчитать общее количество <li> элементов <div id="selected"></div>. Как это возможно с помощью jQuery .children([selector])?

7 ответов


можно использовать .length С селектор, например:

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

если вы должны использовать .children(), тогда это так:

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

вы можете протестировать обе версии здесь.


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

или:

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

быстрый:

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

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

вы, вероятно, могли бы также опустить li в селекторе детей.

посмотреть .length.


вы можете использовать JavaScript (не нужен jQuery)

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

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

или еще лучше

 $('#selected li').length;

это просто возможно с 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>