Odpájanie obslužných programov udalostí v cykle v JavaScripte

Nech máme teraz nie jeden prvok, ale niekoľko. Napríklad niekoľko odsekov:

html<p>text1</p>
<p>text2</p>
<p>text3</p>

Poďme ku každému z týchto odsekov obslužným programom kliku pripojiť funkciu func:

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

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

function func() {
  console.log(this.textContent);
}

Poďme teraz upraviť kód tak, aby každý odsek reagoval len na prvé stlačenie. Na to pri kliknutí na odsek odpojíme od neho pripojený obslužný program. Pritom odpájanie bude konkrétne od tohto odseku, nijak neovplyvní ostatné.

Ako už viete, prvok, v ktorom nastala udalosť, je možné získať v funkcii-obslužnom programe cez this. To znamená, že je potrebné vykonať odpájanie obslužného programu od this, takto:

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

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

function func() {
  console.log(this.textContent);
  this.removeEventListener('click', func); // odpojíme obslužný program
}