Semak sama ada event.target mempunyai Kelas Khusus Menggunakan JavaScript

Gayakan elemen menggunakan penggayaan CSS. Untuk berbuat demikian, buat kelas CSS “ .div ” untuk semua elemen div:

Buat ' .pusat ” kelas untuk menetapkan elemen di tengah halaman:

Kini, untuk penggayaan, setiap div secara individu mencipta kelas CSS untuk mereka. Untuk div pertama, tetapkan warna latar belakang “ merah ' di dalam ' div1Style ” kelas:

Untuk div kedua, tetapkan warna latar belakang “ merah jambu lobak ' menggunakan ' rgba(194, 54, 77) 'kod dalam' div2Style ” kelas:

Tetapkan warna latar belakang “ merah jambu ” daripada div ketiga dengan mencipta “ div3Style ” kelas:

Selepas menjalankan kod HTML di atas, output akan kelihatan seperti ini:

Sekarang, dalam fail JavaScript atau ' skrip ”, gunakan kod yang disediakan di bawah untuk menyemak sama ada event.target mempunyai kelas tertentu atau tidak:

Dalam coretan kod di atas:

• Mula-mula, lampirkan pendengar acara pada acara klik yang akan mengendalikan setiap klik pada DOM.
• Kemudian, semak sama ada peristiwa yang dicetuskan mempunyai kelas CSS “ pusat ” atau tidak dengan bantuan “ classList.class() ” kaedah.

Pengeluaran

GIF di atas menunjukkan bahawa div1 mengandungi ' pusat 'kelas seperti yang ditunjukkan' benar ”, manakala div2 dan div3 memaparkan “ salah ” dalam kotak amaran, yang bermaksud ia tidak mengandungi “ pusat ” kelas.

Kaedah 2: Semak sama ada event.target mempunyai Kelas Khusus Menggunakan Kaedah matches().

Satu lagi kaedah pratakrif JavaScript yang dipanggil ' perlawanan() ” boleh digunakan untuk menyemak sama ada kelas tertentu tergolong dalam elemen atau peristiwa. ' nama kelas ” ialah satu-satunya parameter yang diperlukan untuk menentukan sama ada elemen atau acara sasaran termasuk kelas tertentu atau tidak.

Sintaks

Sintaks yang diberikan di bawah digunakan untuk kaedah matches():

Dalam sintaks di atas,

• “ acara.sasaran ” ialah peristiwa tercetus yang akan disemak sama ada ia mengandungi kelas tertentu atau tidak.
• ' nama kelas ” menunjukkan nama kelas CSS yang merupakan sebahagian daripada peristiwa yang dicetuskan. Kaedah matches() mengambil nama kelas bersama-sama dengan titik (.) yang menandakan perkataan “ kelas ”.

Nilai pulangan

Jika acara sasaran mempunyai kelas, ia mengembalikan “ benar 'lain,' salah ” dikembalikan.

Contoh

Dalam fail JavaScript atau teg skrip, gunakan baris kod di bawah untuk menyemak sama ada event.target mempunyai kelas tertentu atau tidak dengan menggunakan “ perlawanan() ' kaedah:

Dalam baris kod di atas:

• Mula-mula, lampirkan pendengar acara pada acara klik yang akan mengendalikan setiap klik pada DOM.
• Kemudian, semak sama ada ' div3Style 'Kelas CSS wujud dalam peristiwa yang dicetuskan menggunakan ' perlawanan() ” kaedah.
• Jika ia hadir, amaran() menunjukkan mesej dengan “ benar ”, lain “ salah ”.

Pengeluaran

GIF di atas menunjukkan bahawa hanya div3 mengandungi ' div3Style 'kelas seperti yang ditunjukkan' benar ”.

Kesimpulan

Untuk menentukan sama ada peristiwa yang dicetuskan mempunyai kelas tertentu, gunakan JavaScript “ mengandungi() ' kaedah atau ' perlawanan() ” kaedah. Walau bagaimanapun, kaedah contains() ialah salah satu pendekatan paling berguna yang digunakan untuk menentukan kelas elemen. Kedua-dua kaedah mengembalikan ' benar 'jika peristiwa yang dicetuskan mempunyai kelas lain' salah ” dikembalikan. Siaran ini menerangkan kaedah untuk menentukan sama ada event.target mempunyai kelas tertentu atau tidak menggunakan JavaScript.