Wie kann man zuverlässig prüfen, ob ein JavaScript-Element eine bestimmte Klasse enthält?

Wie überprüfe ich, ob ein Element eine Klasse in JavaScript enthält?

Problem:

Die Überprüfung, ob ein Element eine bestimmte Klasse besitzt, ist eine häufige Anforderung in JavaScript. Wenn man sich jedoch ausschließlich auf className-Eigenschaftsvergleiche verlässt, wie im bereitgestellten Beispiel gezeigt, scheitert es, wenn das Element mehrere Klassen enthält.

Lösung:

Um das Vorhandensein von effektiv festzustellen Für eine bestimmte Klasse verwenden Sie unabhängig von der Gesamtzahl der dem Element zugewiesenen Klassen die Methode classList.contains.

element.classList.contains(className);

Diese Methode funktioniert einwandfrei in modernen Browsern, und Polyfills sind für ältere Browser verfügbar.

Alternativer Ansatz:

Für eine breitere Kompatibilität sollten Sie indexOf mit einer leichten Modifikation verwenden:

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

Diese Anpassung stellt sicher, dass teilweise Übereinstimmungen mit Klassennamen keine fehlerhaften Ergebnisse liefern Ergebnisse.

Demo:

var test = document.getElementById("test"),
    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;
    }
}

In diesem Beispiel identifiziert und zeigt der Code effizient die im Element vorhandene Klasse an, auch wenn sie von anderen Klassen begleitet wird.

Das obige ist der detaillierte Inhalt vonWie kann man zuverlässig prüfen, ob ein JavaScript-Element eine bestimmte Klasse enthält?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!