Wie kann man in JavaScript effizient auf das Vorhandensein von Elementklassen prüfen?

Überprüfung auf Vorhandensein von Elementklassen in JavaScript

Wie können Sie mit einfachem JavaScript feststellen, ob ein Element eine bestimmte Klasse enthält? Bei Verwendung der className-Eigenschaft ist eine genaue Klassenübereinstimmung erforderlich, was zu Einschränkungen führt, wenn ein Element mehrere Klassen hat.

Lösung: element.classList.contains

Element. classList stellt eine .contains-Methode bereit, die speziell für diesen Zweck entwickelt wurde:

element.classList.contains(className);

Diese Methode wird von allen modernen Browsern unterstützt und kann unterstützt werden polyfilled für ältere Versionen.

Alternative: Verwendung von indexOf

Alternativ können Sie element.className und indexOf für ältere Browser verwenden, denen die ClassList-Unterstützung fehlt, jedoch sind geringfügige Anpassungen erforderlich um die Genauigkeit zu gewährleisten:

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

Dadurch wird sichergestellt, dass die gesuchte Klasse kein Teilstring einer anderen Klasse ist Name.

Codebeispiel

So wenden Sie diese Lösung auf Ihre spezifische Situation an:

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;
    }
}

Dieser Code verwendet einen effizienteren Ansatz durch Durchschleifen eine vordefinierte Reihe potenzieller Klassen, die Redundanz reduziert und die Wartbarkeit verbessert.

Das obige ist der detaillierte Inhalt vonWie kann man in JavaScript effizient auf das Vorhandensein von Elementklassen prüfen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!