JavaScript-de işleýjileri aýlawda goşmak

Indi elementlere ýygy-ýygydan wakalar işleýjilerini goşmagy öwreneliň. Mysal üçin, aşakdaky ýazylarymyz bar diýeliň:

html<p>tekst1</p>
<p>tekst2</p>
<p>tekst3</p>

Bizde şeýle hem bir funksiýa bar diýeliň:

javascriptfunction func() {
  console.log('!');
}

Geliň ýazylarymyzy aýlawdan geçirip we her ýazynyň basylma wakasyna func funksiýasyny işleýji hökmünde goşalyň:

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

for (let elem of elems) {
  elem.addEventListener('click', func);
}

Geliň öňe çykyp, islendik ýazyna basylanda şol ýazynyň tekstiniň çykyş edilmegini edeliň. Emma bir kynçylyk bar: ýazylar köp, işleýji funksiýa bolsa bir. Işleýji funksiýanyň içinde ýazylarymyzy nädip tapawutlandyrar ýaly?

Bu ýerde bizä this obýekti kömek eder - waka bolup geçýän çagyryşda bu obýekt şol elemente görkezer, nämede waka bolsa. func funksiýamyzyň koduny aýdylanlara laýyklykda üýtgedeliň:

javascriptfunction func() {
  console.log(this.textContent); // ýazynyň tekstini çykaryň
}

javascriptfunction func() {
  this.value = Number(this.value) + 1;
}