Contate i discendenti
Abbiamo un alberatura HTML strutturata come un elenco di ul/li annidati.
Scrivete il codice che per ogni elemento <li> mostri:
- Qual è il testo al suo interno (senza considerare il testo di eventuali sottoelementi).
- Il numero degli elementi
<li>annidati – tutti i discendenti, considerando tutti i livelli di annidamento.
Effettuiamo un ciclo iterativo sugli elementi <li>:
for (let li of document.querySelectorAll('li')) {
...
}Per ciascuna iterazione abbiamo bisogno di ricavare il testo all’interno di ogni li.
Possiamo leggere il testo dal primo nodo figlio di li, che è un nodo di testo:
for (let li of document.querySelectorAll('li')) {
let title = li.firstChild.data;
// title è il testo nel <li> prima di qualsiasi altro nodo
}A questo punto possiamo ricavare il numero dei discendenti con li.getElementsByTagName('li').length.