JavaScript-те универсалды оқиға делегациясы

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

Біздің кодтың кемшілігі li-нің ішінде кірістірілген тегтер болған жағдайда байқалады. Біздің жағдайда бұл i тегтері болсын:

<ul>
	<li>item <i>italic</i> item</li>
	<li>item <i>italic</i> item</li>
	<li>item <i>italic</i> item</li>
	<li>item <i>italic</i> item</li>
	<li>item <i>italic</i> item</li>
</ul>

Бұл жағдайда i тегіне басу тегтің соңына i үлекі таңбасын қосуға әкеледі, li тегіне емес, біз қалағандай - себебі event.target-те дәл оқиға болған тег келеді.

Мәселені closest әдісімен шешуге болады:

list.addEventListener('click', function(event) {
	let li = event.target.closest('li');
	
	if (li) {
		li.innerHTML = li.innerHTML + '!';
	}
});

Келтірілген шешімді қайталаңыз.