Melampirkan Pengendali dalam Gelung pada JavaScript

Dalam pelajaran sebelumnya, kita belajar mencipta elemen baharu dalam gelung. Sekarang mari kita lampirkan pengendali peristiwa semasa mencipta elemen baharu.

Katakan kita sekali lagi mempunyai div induk ini:

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

Jalankan gelung yang akan menambahkan 9 perenggan baharu ke akhir div kami, dan lampirkan pengendali klik pada mereka:

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

for (let i = 1; i <= 9; i++) {
  let p = document.createElement('p');
  p.textContent = '!';
  
  // Lampirkan pengendali klik:
  p.addEventListener('click', function() {
    console.log(this.textContent);
  });
  
  parent.appendChild(p);
}