Odstraňování obslužných rutin událostí ve smyčce v JavaScriptu

Nyní předpokládejme, že nemáme jeden prvek, ale několik. Například několik odstavců:

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

Připojme k každému z těchto odstavců funkci func jako obslužnou rutinu kliknutí:

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

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

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

Nyní kód upravme tak, aby každý odstavec reagoval pouze na první kliknutí na něj. K tomu při kliknutí na odstavec odebereme připojenou obslužnou rutinu. Toto odebrání se bude týkat konkrétně tohoto odstavce a nijak neovlivní ostatní.

Jak již víte, prvek, ve kterém došlo k události, lze v obslužné funkci získat pomocí this. To znamená, že je třeba provést odebrání obslužné rutiny z this, takto:

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

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

function func() {
	console.log(this.textContent);
	this.removeEventListener('click', func); // odstraňujeme obslužnou rutinu
}

Jsou dány odstavce. Po kliknutí na kterýkoli odstavec přidejte na jeho konec vykřičník. Zařiďte, aby k tomuto přidání docházelo pouze při prvním kliknutí.