JavaScript-те циклде оқиғалар өңдеушілерін ажырату

Енді бізде бір элемент емес, бірнеше элемент бар делік. Мысалы, бірнеше абзац:

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

Осы абзацтардың әрқайсысына түрткінің өңдеушісі ретінде func функциясын байланыстырайық:

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

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

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

Енді кодты әрбір абзац тек оған бірінші рет басқанда ғана жауап беретіндей етіп өзгертейік. Ол үшін абзацқа басқанда, оған байланыстырылған өңдеушіні ажыратамыз. Сонымен бірге ажырату дәл осы абзацқа қатысты болады, қалғандарына әсер етпейді.

Өңдеуші функцияда оқиға болған элементті this арқылы алуға болатынын білесіз. Бұл this-тен өңдеушіні ажырату керек дегенді білдіреді, мынау сияқты:

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

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

function func() {
	console.log(this.textContent);
	this.removeEventListener('click', func); // өңдеушіні ажыратамыз
}

Абзацтар берілген. Кез келген абзацқа басқанда, оның соңына леп белгісін қосыңыз. Бұл қосу тек бірінші рет басқанда ғана орындалатындығын жасаңыз.