Comment puis-je compter le nombre d'enfants ?

Question

J'ai une liste

<ul>
  <li>
  <li>
  <li>
  ...
</ul>

J'ai besoin de jQuery pour compter le nombre d'éléments dans ma liste.

Answer 1

Vous pouvez utiliser .length comme ceci :

var count = $("ul li").length;

.length indique combien de correspondances le sélecteur a trouvé, donc cela compte combien de <li> sous <ul> éléments que vous avez... s'il y a des sous-enfants, utilisez "ul > li" pour obtenir seulement direct enfants. Si vous avez d'autres <ul> dans votre page, changez simplement le sélecteur pour qu'il ne corresponde qu'à son élément, par exemple s'il a un ID, vous utiliserez "#myListID > li" .

Dans d'autres situations où vous ne connaissez pas le type d'enfant, vous pouvez utiliser la fonction * (joker), ou .children() comme ceci :

var count = $(".parentSelector > *").length;

o:

var count = $(".parentSelector").children().length;

Answer 2

Vous n'avez pas besoin de jQuery pour cela. Vous pouvez utiliser la fonction JavaScript .childNodes.length .

Veillez à soustraire 1 si vous ne voulez pas inclure le nœud de texte par défaut (qui est vide par défaut). Ainsi, vous utiliserez ce qui suit :

var count = elem.childNodes.length - 1;

Answer 3

Essayez d'en prendre :

var count = $("ul > li").size();
alert(count);

Answer 4

Vous pouvez utiliser Element.childElementCount

réf : https://developer.mozilla.org/en-US/docs/Web/API/Element/childElementCount

let count = ThatParentElement.childElementCount;

Answer 5

Vous pouvez le faire en utilisant jQuery :

Cette méthode obtient une liste de ses enfants puis compte la longueur de cette liste, aussi simple que cela.

$("ul").find("*").length;

La méthode find() parcourt le DOM vers le bas le long des descendants, jusqu'au dernier descendant.

Note : La méthode children() parcourt un seul niveau de l'arbre DOM.