jquery ändert den Elementstil

jQuery ist eine JavaScript-Bibliothek, die das Schreiben von JavaScript prägnanter, leichter lesbar und einfacher zu warten macht. Bei der Webentwicklung müssen wir häufig den Stil von Elementen ändern. In diesem Artikel wird gezeigt, wie Sie mit jQuery den Stil von Elementen ändern können, indem Sie die stilbezogenen Methoden von jQuery vorstellen.

1. .css()-Methode

Um den Stil eines Elements zu ändern, können wir die .css()-Methode verwenden. Mit dieser Methode können die CSS-Eigenschaften des Elements abgerufen und festgelegt werden. Um eine Eigenschaft festzulegen, müssen wir zwei Parameter übergeben: Eigenschaftsname und Eigenschaftswert. Zum Beispiel:

$(selector).css('property', 'value');

Unter diesen ist der Selektor der Selektor des zu bedienenden Elements; die Eigenschaft ist der Name der zu ändernden CSS-Eigenschaft, z. B. „Hintergrundfarbe“, „Schriftgröße“ usw. ; value ist der Wert der festzulegenden CSS-Eigenschaft.

Der folgende Code ändert beispielsweise die Hintergrundfarbe eines Elements mit der ID „myDiv“ in Rot:

$('#myDiv').css('background-color', 'red');

2. .addClass()-Methode

Wenn Sie dem Element eine oder mehrere CSS-Klassen hinzufügen möchten , Wir können die Methode .addClass() verwenden.

$(selector).addClass(classname);

wobei Klassenname der Name einer oder mehrerer CSS-Klassen ist, die dem Element hinzugefügt werden sollen, getrennt durch Leerzeichen.

Der folgende Code fügt beispielsweise eine CSS-Klasse mit dem Namen „selected“ zu einem Element mit der ID „myDiv“ hinzu:

$('#myDiv').addClass('selected');

3. .removeClass()-Methode

Wenn Sie eine oder mehrere CSS-Klassen entfernen möchten können wir die Methode .removeClass() verwenden.

$(selector).removeClass(classname);

wobei Klassenname der Name einer oder mehrerer CSS-Klassen ist, die aus dem Element entfernt werden sollen, getrennt durch Leerzeichen.

Der folgende Code entfernt beispielsweise die CSS-Klasse mit dem Namen „selected“ aus einem Element mit der ID „myDiv“:

$('#myDiv').removeClass('selected');

4. .toggleClass()-Methode

Wenn Sie umschalten möchten, ob ein Element ein For enthält Für CSS-Klassen können wir die Methode .toggleClass() verwenden.

$(selector).toggleClass(classname);

Wenn das Element die angegebene CSS-Klasse enthält, wird die Klasse aus dem Element entfernt. Wenn die angegebene CSS-Klasse nicht im Element enthalten ist, wird die Klasse dem Element hinzugefügt.

Der folgende Code ändert beispielsweise, ob ein Element mit der ID „myDiv“ die CSS-Klasse mit dem Namen „selected“ enthält:

$('#myDiv').toggleClass('selected');

Die oben genannten sind die wichtigsten stilbezogenen Methoden, mit denen wir den Stil von flexibel ändern können das Element. Weitere jQuery-Methoden können auch in der offiziellen Dokumentation eingesehen werden.

Das obige ist der detaillierte Inhalt vonjquery ändert den Elementstil. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!