Heim  >  Artikel  >  Web-Frontend  >  Wie entferne ich CSS-Klassen mit JavaScript ohne jQuery?

Wie entferne ich CSS-Klassen mit JavaScript ohne jQuery?

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2024-11-11 17:33:03614Durchsuche

How to Remove CSS Classes with JavaScript Without jQuery?

CSS-Klassen mit JavaScript ohne jQuery entfernen

Das Entfernen einer CSS-Klasse aus einem Element mithilfe von JavaScript ist eine häufige Aufgabe in der Webentwicklung. Um dies ohne jQuery zu erreichen, gibt es mehrere Ansätze, wobei der einfachste die Verwendung der classList-Eigenschaft ist.

Verwendung von classList

Die classList-Eigenschaft bietet eine einfache Schnittstelle zum Bearbeiten von Klassen für ein Element. Um eine bestimmte Klasse zu entfernen, verwenden Sie einfach die Methode „remove()“:

ELEMENT.classList.remove("CLASS_NAME");

Beispiel

Berücksichtigen Sie das folgende HTML und CSS:

<div>
.red {
  background: red;
}

Um die Klasse „red“ mithilfe von classList aus dem Element „el“ zu entfernen, kann der folgende Code verwendet werden verwendet:

var el = document.getElementById("el");
el.classList.remove("red");

Alternative Ansätze

Während classList der am meisten empfohlene Ansatz ist, gibt es alternative Möglichkeiten zum Entfernen von Klassen, wie zum Beispiel:

  • Attributmanipulation: Festlegen des Attributs „className“ auf die neue Klassenliste ohne das Ziel Klasse.
  • Ersetzung regulärer Ausdrücke:Verwenden von replace(), um die Zielklasse aus der KlassenName-Zeichenfolge zu entfernen.

Diese Methoden sind jedoch weniger effizient und flexibel im Vergleich zur Verwendung von classList.

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

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn