Kuongeza Vichakataji Katika Kitanzi katika JavaScript

Hebu sasa tujifunze jinsi ya kuongeza kwa wingi vichakataji matukio kwa vipengele. Hebu sema, kwa mfano, tuna aya:

html<p>maandishi1</p>
<p>maandishi2</p>
<p>maandishi3</p>

Hebu sema pia tuna kitendakazi:

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

Hebu tutunge aya zetu katika kitanzi na kila aya tuongeze kama kichakataji cha kubonyeza kitendakazi func:

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

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

Hebu tuendelee zaidi na tufanye ili kwa kubonyeza kwa aya yoyote ionyeshe maandishi ya aya hiyo. Hata hivyo, kuna tatizo: kuna aya nyingi, lakini kichakataji kitendakazi kimoja. Basi vipi tunaweza kutofautisha aya zetu ndani ya kichakataji kitendakazi?

Hili latusaidia kwa kutumia kitu this - wakati kitendakazi kinapoitwa wakati wa tukio kitu hiki kitaelekeza kwenye kipengele ambapo tukio hili lilitokea. Hebu tubadilishe msimbo wa kitendakazi chetu func kulingana na yaliyosemwa:

javascriptfunction func() {
  console.log(this.textContent); // tunatoa maandishi ya aya
}

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