DOM элементларини JavaScript да рақамлаш

Итераторларни тушуниш DOM элементларини осонлик билан рақамлаш имконини беради. Масалан, бизда қуйидаги абзацлар бор деб фараз қилайлик:

html<p>матн</p>
<p>матн</p>
<p>матн</p>

Келик, бу абзацлар коллекциясини ўзгарувчига оламиз:

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

Уларни санash учun ички итератор entries дан фойдаланамиз:

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

Рақамларни элементлардан ажратиш учун деструктуризациадан фойдаланамиз:

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

Ҳар бир абзацнинг охирига унинг тартиб рақамини қўшамиз:

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