So fügen Sie CSS-Stile in jQuery hinzu oder entfernen sie

Bei der Arbeit muss ich oft Javascript verwenden, um den Stil von Seitenelementen zu ändern. Eine Möglichkeit besteht darin, die CSS-Klasse (Class) des Seitenelements zu ändern. In herkömmlichem Javascript verwenden wir dazu normalerweise drei Methoden, um diese Funktion zu erreichen traditionelle Methode, aber sie spart viel Code. Immer noch derselbe Satz – „jQuery macht JavaScript-Code prägnant!“

1. CSS-Klasse hinzufügen

$("#target"). "newClass");
//#target bezieht sich auf die ID des Elements, zu dem der Stil hinzugefügt werden muss
//newClass bezieht sich auf den Namen der CSS-Klasse

2. removeClass( ) – CSS-Klasse entfernen

$("#target").removeClass("oldClass");
//#target bezieht sich auf die ID des Elements, dessen CSS-Klasse muss entfernt werden
//oldClass bezieht sich auf den Namen der CSS-Klasse

3. toggleClass() – CSS-Klasse hinzufügen oder entfernen

Wenn die Wenn die CSS-Klasse bereits vorhanden ist, wird sie entfernt. Wenn die CSS-Klasse nicht vorhanden ist, wird sie hinzugefügt.

$("#target").toggleClass("newClass")
//Wenn für das Element mit der ID „target“ ein CSS-Stil definiert ist, wird dieser entfernt;
// Andernfalls , wird der CSS-Klasse „newClass“ die ID zugewiesen.

In tatsächlichen Anwendungen definieren wir häufig zuerst diese CSS-Klassen und ändern dann den Seitenelementstil durch Auslösen von Javascript-Ereignissen (z. B. durch Klicken auf einen Link). Darüber hinaus stellt jQuery auch eine Methode hasClass("className") bereit, um festzustellen, ob einem Element eine CSS-Klasse zugewiesen wurde.

FAQ:

<label for="TrueName" generated="true" class="msg-error" style="">正确</label>

By addClass("msg-success");

<label for="TrueName" generated="true" class="msg-error msg-success" style="">正确</label>

CSS文件
误：（msg-success将被msg-error覆盖，样式不变）
span.msg-error, label.msg-error{color: #f00;}
span.msg-success, label.msg-success{color: #000;}
正：
span.msg-error, label.msg-error{color: #f00;}
span.msg-success, label.msg-success{color: #000;}

Das obige ist der detaillierte Inhalt vonSo fügen Sie CSS-Stile in jQuery hinzu oder entfernen sie. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!