Bagaimana untuk Memeriksa Kehadiran Kelas Unsur dengan Cekap dalam JavaScript?

Menyemak Kehadiran Kelas Unsur dalam JavaScript

Menggunakan JavaScript asas, bagaimana anda boleh menentukan sama ada elemen mengandungi kelas tertentu? Apabila menggunakan sifat className, padanan kelas yang tepat diperlukan, yang membawa kepada pengehadan apabila elemen mempunyai berbilang kelas.

Penyelesaian: element.classList.contains

Elemen. classList mendedahkan kaedah .contains yang direka khusus untuk tujuan ini:

element.classList.contains(className);

Kaedah ini disokong oleh semua pelayar moden dan boleh diisi poli untuk versi lama.

Alternatif: Menggunakan indexOf

Sebagai alternatif, anda boleh menggunakan element.className dan indexOf untuk penyemak imbas lama yang tidak mempunyai sokongan classList, tetapi pelarasan kecil diperlukan untuk memastikan ketepatan:

function hasClass(element, className) {
    return (' ' + element.className + ' ').indexOf(' ' + className+ ' ') > -1;
}

Ini memastikan bahawa kelas yang dicari bukan subrentetan nama kelas lain.

Contoh Kod

Untuk menggunakan penyelesaian ini pada situasi khusus anda:

var test = document.getElementById("test");
var classes = ['class1', 'class2', 'class3', 'class4'];

test.innerHTML = "";

for(var i = 0, j = classes.length; i < j; i++) {
    if(hasClass(test, classes[i])) {
        test.innerHTML = "I have " + classes[i];
        break;
    }
}

Kod ini menggunakan pendekatan yang lebih cekap dengan menggelung melalui tatasusunan kelas berpotensi yang telah ditetapkan, mengurangkan redundansi dan menambah baik kebolehselenggaraan.

Atas ialah kandungan terperinci Bagaimana untuk Memeriksa Kehadiran Kelas Unsur dengan Cekap dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!