Wie entferne ich CSS-Klassen mithilfe von JavaScript aus Elementen?

CSS-Klassen mit JavaScript entfernen

JavaScript bietet eine direkte Methode zum Entfernen von CSS-Klassen aus Elementen, ohne dass jQuery erforderlich ist. Diese Methode verwendet die Eigenschaft classList, die von den meisten modernen Browsern unterstützt wird.

Schritte zum Entfernen einer CSS-Klasse mit classList:

1. Wählen Sie die aus Element: Identifizieren Sie mit document.querySelector oder das Element, aus dem Sie die CSS-Klasse entfernen möchten document.getElementById.

2. Klasse entfernen: Verwenden Sie die Methode classList.remove(), um die gewünschte CSS-Klasse zu entfernen. Die Syntax lautet wie folgt:

   ELEMENT.classList.remove("CLASS_NAME");

Beispiel:

So entfernen Sie die Klasse „rot“ aus einem Element mit der ID „el ', würden Sie den folgenden Code verwenden:

const el = document.querySelector('#el');
el.classList.remove("red");

Alternative Methoden:

Während classList.remove() der empfohlene Ansatz ist, gibt es alternative Methoden zum Entfernen von CSS-Klassen:

• .removeAttribute(): Diese Methode entfernt ein gesamtes Attribut, einschließlich des Klassennamens. Es ist jedoch weniger effizient als classList.remove().
• Ersetzen des Klassenattributs: Sie können das gesamte Klassenattribut durch einen neuen Wert ersetzen, der die Klasse ausschließt, die Sie entfernen möchten.

Das obige ist der detaillierte Inhalt vonWie entferne ich CSS-Klassen mithilfe von JavaScript aus Elementen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!