Penyelaman Peristiwa dalam JavaScript

Selain bubbling peristiwa ada juga penyelaman. Sebenarnya peristiwa pertama-tama berjalan dari atas ke bawah (tahap capturing), sampai ke elemen kita (tahap target) dan baru kemudian mulai bubbling (tahap bubbling).

Untuk memasang penangan peristiwa dengan mempertimbangkan tahap capturing di addEventListener ada parameter ketiga yang opsional. Jika ia sama dengan true - peristiwa akan bekerja pada tahap capturing, dan jika false - pada tahap bubbling (ini secara default). Mari kita lihat contohnya:

elem1.addEventListener('click', function() {
	console.log('hijau - penyelaman');
}, true);
elem1.addEventListener('click', function() {
	console.log('hijau - bubbling');
}, false);

elem2.addEventListener('click', function() {
	console.log('biru muda - penyelaman');
}, true);
elem2.addEventListener('click', function() {
	console.log('biru muda - bubbling');
}, false);

elem3.addEventListener('click', function() {
	console.log('merah - penyelaman');
}, true);
elem3.addEventListener('click', function() {
	console.log('merah - bubbling');
}, false);

Anda bisa mencoba: