Numerazione degli elementi DOM in JavaScript

Comprendere gli iteratori permette di aggiungere facilmente numeri agli elementi DOM. Supponiamo, ad esempio, di avere dei paragrafi:

html<p>testo</p>
<p>testo</p>
<p>testo</p>

Otteniamo una collezione di questi paragrafi in una variabile:

javascriptlet elems = document.querySelectorAll('p');

Utilizziamo l'iteratore integrato entries per l'iterazione:

javascriptfor (let entry of elems.entries()) {
  console.log(entry);
}

Usiamo la destrutturazione per separare i numeri dagli elementi:

javascriptfor (let [num, elem] of elems.entries()) {
  console.log(num, elem);
}

Aggiungiamo alla fine di ogni paragrafo il suo numero d'ordine:

javascriptfor (let [num, elem] of elems.entries()) {
  elem.textContent += num;
}