การเพิ่มตัวจัดการเหตุการณ์แบบไม่ระบุชื่อในลูปด้วย JavaScript

คุณสามารถใช้ฟังก์ชันแบบไม่ระบุชื่อเป็นตัวจัดการเหตุการณ์ที่เพิ่มในลูปได้ วิธีนี้ทำให้โค้ดกระชับขึ้นและช่วยให้เราไม่ต้องคิดชื่อสำหรับฟังก์ชันที่ ใช้เพียงที่เดียวเท่านั้น

ลองเพิ่มตัวจัดการเหตุการณ์แบบไม่ระบุชื่อให้กับองค์ประกอบต่างๆ กัน:

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

for (let elem of elems) {
	elem.addEventListener('click', function() {
		console.log(this.textContent);
	});
}

มีโค้ดต่อไปนี้:

<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>

let divs = document.querySelectorAll('div');

for (let div of divs) {
	div.addEventListener('click', func);
}

function func() {
	this.textContent++;
}

ทำให้ฟังก์ชันตัวจัดการเหตุการณ์เป็นแบบไม่ระบุชื่อ