Nummerering av DOM-elementer i JavaScript

Forståelse av iteratorer gjør det enkelt å legge til nummer til DOM-elementer. La oss for eksempel si at vi har avsnitt:

html<p>tekst</p>
<p>tekst</p>
<p>tekst</p>

La oss hente samlingen av disse avsnittene i en variabel:

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

La oss bruke den innebygde iteratoren entries for å gå gjennom:

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

La oss bruke destructuring for å skille numre fra elementer:

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

La oss legge til hvert avsnitts rekkefølgenummer på slutten:

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