Bagaimana untuk Semak sama ada Elemen Mengandungi Kelas Khusus dalam JavaScript?

Cara Menyemak sama ada Elemen Mengandungi Kelas dalam JavaScript

Apabila bekerja dengan elemen dalam JavaScript, selalunya berguna untuk menyemak sama ada elemen mengandungi kelas tertentu.

Masalahnya:

Menggunakan kaedah tradisional untuk membandingkan sifat className elemen dengan nama kelas yang tepat menghasilkan positif palsu apabila elemen mengandungi berbilang kelas. Sebagai contoh, jika elemen mempunyai kelas kelas1 dan kod menyemak kelas1, ia akan mengembalikan palsu jika elemen itu juga mempunyai kelas lain.

Penyelesaian: element.classList.contains()

Penyelesaian moden ialah menggunakan kaedah element.classList.contains(), yang mengembalikan benar jika elemen mengandungi kelas yang ditentukan.

element.classList.contains(className);

Kaedah ini berfungsi merentas semua penyemak imbas utama dan mempunyai polyfill tersedia untuk penyemak imbas lama.

Alternatif: indexOf() dengan Pengubahsuaian

Untuk keserasian dengan penyemak imbas lama, kaedah indexOf() boleh digunakan, tetapi ia memerlukan sedikit pengubahsuaian untuk mengelakkan positif palsu:

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

Digunakan pada Contoh

Menggunakan kaedah classList.contains(), kod yang disediakan boleh dipermudahkan kepada :

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

test.innerHTML = "";

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

Pendekatan ini menghapuskan lebihan dan menyediakan pemeriksaan yang lebih mantap untuk kehadiran kelas.

Atas ialah kandungan terperinci Bagaimana untuk Semak sama ada Elemen Mengandungi Kelas Khusus dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!