JavaScript'te DOM Elemanlarını Numaralandırma

Yineleyicileri anlamak, DOM elemanlarına numara eklemeyi kolaylaştırır. Örneğin, elimizde şu paragraflar olsun:

html<p>metin</p>
<p>metin</p>
<p>metin</p>

Bu paragrafların koleksiyonunu bir değişkene alalım:

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

Numaralandırmak için yerleşik entries yineleyicisini kullanalım:

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

Numaraları elemanlardan ayırmak için yapıyı çözelim (destructuring):

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

Her paragrafın sonuna sıra numarasını ekleyelim:

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