Come posso contare il numero di bambini?

108

Ho una lista

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

Ho bisogno di jQuery per contare il numero di elementi nel mio elenco.

jquery

— aneuryzm
fonte

1

dimenticare jquerydocument.querySelectorAll('ul li').length

— caub

188

Puoi usare .length, in questo modo:

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

.lengthdice quante corrispondenze ha trovato il selettore, quindi questo conta quanti elementi <li>sotto <ul>hai ... se ci sono sotto-figli, usa "ul > li"invece per ottenere solo figli diretti . Se hai altri <ul>elementi nella tua pagina, cambia semplicemente il selettore in modo che corrisponda solo a quello, ad esempio se ha un ID che useresti "#myListID > li".

In altre situazioni in cui non conosci il tipo di figlio, puoi utilizzare il *selettore (carattere jolly) o .children(), in questo modo:

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

o:

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

— Nick Craver
fonte

1

E se non si sapesse che il bambino è "li" e potrebbe essere qualsiasi cosa?

— Starx

7

@Starx:$("#parent").children().length

— rekamoyka

1

@ AlecAnanian, No, so come. Voglio dire, speravo che Nick lo aggiungesse anche alla sua risposta.

— Starx

2

@Starx - aggiunto nel caso in cui aiuti alcune persone lungo la strada :)

— Nick Craver

E se l'elemento non è visibile?

— ᴍᴀᴛᴛ ʙᴀᴋᴇʀ

6

Non hai bisogno di jQuery per questo. Puoi usare JavaScript .childNodes.length.

Assicurati solo di sottrarre 1 se non vuoi includere il nodo di testo predefinito (che è vuoto per impostazione predefinita). Quindi, useresti quanto segue:

var count = elem.childNodes.length - 1;

— Zach Saucier
fonte

1

Prova a utilizzare:

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

0

Cosa succede se lo stai usando per determinare il selettore corrente per trovare i suoi figli, quindi questo vale: <ol>allora c'è <li>s sotto come scrivere un selettore var count = $(this+"> li").length;non funzionerà ..

— Oguzhan
fonte

se l'ol ha una classe puoi scrivere$("ol.class > li").length

— Qwerty

0

Puoi farlo usando jQuery:

Questo metodo ottiene un elenco dei suoi figli, quindi conta la lunghezza di tale elenco, così semplice.

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

Il metodo find () attraversa DOM verso il basso lungo i discendenti, fino all'ultimo discendente.

Nota: il metodo children () attraversa un singolo livello più in basso dell'albero DOM.

— Youssof H.
fonte