TL;DR
- Memantau kejadian bertipe tertentu dengan
monitorEvents()
. - Menggunakan
unmonitorEvents()
untuk berhenti memantau. - Mengetahui daftar listener suatu elemen DOM dengan
getEventListeners()
. - Menggunakan panel Event Listeners Inspector untuk mendapatkan informasi tentang event listener.
Memantau kejadian
Metode monitorEvents() memerintahkan DevTools untuk membuat log yang mencatat informasi mengenai target yang ditetapkan.
Parameter pertama adalah objek yang akan dipantau. Semua kejadian pada objek itu akan dikembalikan jika tidak ada parameter kedua. Untuk menetapkan kejadian yang akan dipantau, teruskan string atau larik string sebagai parameter kedua.
Untuk memantau kejadian klik pada tubuh laman:
monitorEvents(document.body, "click");
Jika kejadian yang dipantau adalah tipe kejadian yang didukung dan dipetakan DevTools ke serangkaian nama kejadian standar, metode ini akan memantau kejadian bertipe itu.
Command Line API memiliki pemetaan penuh tipe kejadian ke kejadian yang dicakupnya.
Untuk berhenti memantau kejadian,
panggil metode unmonitorEvents()
dan masukkan objek yang akan dihentikan pemantauannya.
Untuk berhenti memantau kejadian pada objek body
:
unmonitorEvents(document.body);
Menampilkan event listener yang terdaftar pada objek
getEventListeners() API mengembalikan event listener yang terdaftar pada objek yang ditetapkan.
Nilai kembaliannya adalah objek yang berisi larik untuk setiap tipe kejadian yang terdaftar (click
atau keydown
, misalnya).
Anggota setiap larik adalah objek yang menjelaskan
listener yang terdaftar untuk setiap tipe.
Misalnya,
kode berikut menampilkan daftar semua event listener yang terdaftar pada objek dokumen:
getEventListeners(document);
Jika terdaftar lebih dari satu listener pada objek yang ditetapkan,
larik akan berisi satu anggota untuk setiap listener.
Dalam contoh berikut,
ada dua event listener yang terdaftar pada elemen #scrollingList untuk kejadian mousedown
:
Luaskan lagi setiap objek ini untuk mempelajari propertinya:
Menampilkan listener yang terdaftar pada elemen DOM
Secara default, panel Event Listeners di Elements Inspector menampilkan semua kejadian yang terhubung ke suatu laman:
Filter membatasi kejadian hanya pada simpul yang dipilih:
Dengan meluaskan objek, panel menampilkan perincian event listener. Dalam contoh ini, laman memiliki dua event listener yang terhubung lewat jQuery: