Numerazione degli elementi DOM in JavaScript
Comprendere gli iteratori permette di aggiungere facilmente numeri agli elementi DOM. Supponiamo, ad esempio, di avere dei paragrafi:
<p>testo</p>
<p>testo</p>
<p>testo</p>
Otteniamo una collezione di questi paragrafi in una variabile:
let elems = document.querySelectorAll('p');
Utilizziamo l'iteratore integrato
entries per l'iterazione:
for (let entry of elems.entries()) {
console.log(entry);
}
Usiamo la destrutturazione per separare i numeri dagli elementi:
for (let [num, elem] of elems.entries()) {
console.log(num, elem);
}
Aggiungiamo alla fine di ogni paragrafo il suo numero d'ordine:
for (let [num, elem] of elems.entries()) {
elem.textContent += num;
}
Data una tabella HTML. Numera ogni cella di questa tabella.