web-dev-qa-db-fra.com

jQuery count éléments enfants

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

Je veux compter le nombre total d'éléments <li> dans <div id="selected"></div>. Comment est-ce possible d'utiliser .children([selector]) de jQuery?

javascriptjquerydom
301
gautamlakum

Vous pouvez utiliser .length avec juste un sélecteur de descendant , comme ceci:

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

Si vous devez utiliser .children() , alors c'est comme ça:

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

Vous pouvez tester les deux versions ici .

566
Nick Craver
$("#selected > ul > li").size()

ou:

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

le plus rapide:

$("div#selected ul li").length
17
Ali Tarhini
_var length = $('#selected ul').children('li').length
// or the same:
var length = $('#selected ul > li').length
_

Vous pouvez probablement aussi omettre li dans le sélecteur pour enfants.

Voir .length .

14
Felix Kling

Vous pouvez utiliser JavaScript (pas besoin de jQuery)

document.querySelectorAll('#selected li').length;
13
Đặng Văn Thanh
$('#selected ul').children().length;

ou même mieux

 $('#selected li').length;
11
Martin Algesten

C'est tout simplement possible avec childElementCount en javascript pur

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>
4
Mo.

pur js

selected.children[0].children.length;

let num = selected.children[0].children.length;

console.log(num);
<div id="selected">
  <ul>
    <li>29</li>
    <li>16</li>
    <li>5</li>
    <li>8</li>
    <li>10</li>
    <li>7</li>
  </ul>
</div>
0
Kamil Kiełczewski