JavaScript'te Döngü İçinde Olay İşleyicileri Eklemek

Önceki derste, bir döngü içinde yeni elemanlar oluşturmayı öğrendik. Şimdi ise yeni elemanlar oluşturulurken olay işleyicileri ekleyeceğiz.

Yine bizim için böyle bir parent div olsun:

html<div id="parent"></div>

Div'imizin sonuna 9 yeni paragraf ekleyen ve onlara tıklama olay işleyicisi atayan bir döngü başlatalım:

javascriptlet parent = document.querySelector('#parent');

for (let i = 1; i <= 9; i++) {
  let p = document.createElement('p');
  p.textContent = '!';
  
  // Tıklama olay işleyicisini ekliyoruz:
  p.addEventListener('click', function() {
    console.log(this.textContent);
  });
  
  parent.appendChild(p);
}