Bestimmen der Präsenz von Elementklassen in JavaScript
Beim Überprüfen der Klassenattribute eines Elements ist es oft notwendig, zu überprüfen, ob es eine bestimmte Klasse enthält. Der bereitgestellte Code verwendet eine Switch-Anweisung, um den genauen Klassenwert eines Elements zu untersuchen, dieser Ansatz erkennt jedoch keine Teilübereinstimmungen.
Um diese Einschränkung zu beheben, sollten Sie die Verwendung der Methode element.classList .contains in Betracht ziehen. Diese Methode akzeptiert einen Klassennamen als Parameter und gibt einen booleschen Wert zurück, der sein Vorhandensein in der Klassenliste des Elements angibt:
element.classList.contains(class);
Diese Methode wird von allen modernen Browsern allgemein unterstützt und bietet eine konsistente Möglichkeit, die Klasseneinbeziehung zu überprüfen.
Alternativ können Sie aus Gründen der Kompatibilität mit älteren Browsern, denen die .contains-Methode fehlt, die folgende modifizierte Version von indexOf verwenden Methode:
function hasClass(element, className) { return (' ' + element.className + ' ').indexOf(' ' + className + ' ') > -1; }
Diese Änderung stellt sicher, dass Sie Teilübereinstimmungen genau erkennen und Fehlalarme vermeiden, wenn die gesuchte Klasse Teil eines größeren Klassennamens ist.
Anwenden dieser Methode auf das bereitgestellte Beispiel :
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; } }
Durch den Einsatz der .contains-Methode oder der modifizierten indexOf-Funktion können Sie unabhängig von der Browserkompatibilität zuverlässig feststellen, ob ein Element eine bestimmte Klasse in JavaScript enthält oder das Vorhandensein teilweiser Übereinstimmungen.
Das obige ist der detaillierte Inhalt vonWie kann ich zuverlässig prüfen, ob eine bestimmte Klasse in JavaScript vorhanden ist?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!