Da wir alle wissen, dass wir aufgrund seines leichten Gewichts viele lustige Aufgaben mit JQuery ausführen können und „weniger schreiben, mehr“ Agenda machen können. Eine solche Aufgabe besteht darin. Sie können CSS ändern, indem Sie die verwenden CSS () Methode von JQuery.

Hier in diesem Leitfaden haben wir diese Methode im Detail erläutert. Darüber hinaus haben wir verschiedene Beispiele gezeigt, die Ihnen helfen, die Methode und ihre Verwendung besser zu verstehen.

CSS () Methode

Die CSS () -Methode in JQuery wird zum Zwecke des Abrufens oder der Anwendung eines oder mehrere Stileigenschaften auf ein HTML -Element verwendet.

Syntax

Eine CSS -Immobilie anzuwenden.

CSS ("Eigenschaft", "Wert");

Eine CSS -Eigenschaft abrufen.

CSS ("Eigentum");

Um mehrere CSS -Eigenschaften anzuwenden.

CSS ("Eigenschaft": "Wert", "Eigenschaft": "Wert" ...);

Um die CSS () -Methode besser zu verstehen, lassen Sie uns einige Beispiele untersuchen.

Beispiel 1: So setzen Sie eine CSS -Eigenschaft

Angenommen, Sie möchten die Hintergrundfarbe von a festlegen

Element unter Verwendung der CSS () -Methode in jQuery.

Html

Einstellen einer CSS -Eigenschaft

Setzen Sie die Hintergrundfarbe von H1

Im obigen HTML -Code haben wir eine erstellt

, und ein Element.

JQuery

$ (Dokument).Ready (function ()
$ (".Taste").klicken (function ()
$ ("H1").CSS ("Hintergrundfarbe", "Gelb");
);
);

Im obigen jQuery -Code haben wir eine gelbe Hintergrundfarbe auf die angewendet

Element unter Verwendung der CSS () -Methode.

Ausgang

Bevor Sie auf die Schaltfläche klicken.

Nach dem Klicken auf die Schaltfläche.

Die Hintergrundfarbe der Überschrift wurde erfolgreich eingestellt.

Wie man eine CSS -Eigenschaft holt

Angenommen, Sie möchten eine CSS. Folgen Sie dem folgenden Code.

Html

Hallo Welt

Rückgabe Hintergrundfarbe von Div

Hier haben wir ein und ein Element erstellt.

JQuery

$ (Dokument).Ready (function ()
$ ("Button").klicken (function ()
alert ("Hintergrund color =" + $ ("div").CSS ("Hintergrundfarbe"));
);
);

Im obigen Code wird die CSS () -Methode nur verwendet, um die dem Element zugewiesene Hintergrundfarbe zu extrahieren. Darüber hinaus wurde eine Warnmeldung erstellt, die die Hintergrundfarbe der DIV anzeigt.

Ausgang

Die Hintergrundfarbe des DIV -Elements wurde abgerufen und erfolgreich angezeigt.

So setzen Sie mehrere CSS -Eigenschaften

Angenommen, Sie möchten jedem HTML -Element auf einmal mehrere Style -Eigenschaften zuweisen. Folgen Sie dem folgenden Beispiel.

Html

Ein Absatz.

Setzen Sie mehrere Stile

Im obigen Code haben wir a erstellt

Element zusammen mit einem Element.

JQuery

$ (Dokument).Ready (function ()
$ ("Button").klicken (function ()
$ ("P").CSS ("Hintergrundfarbe": "Gelb", "Polsterung": "25px", "Breite": "200px");
);
);

Mit der Jquery CSS () -Methode haben wir eine Hintergrundfarbe auf die angewendet

Element und zugewiesen etwas Polsterung und Breite.

Ausgang

Es kann aus der obigen Ausgabe überprüft werden, dass mehrere Stile auf einmal auf einmal auf einmal angewendet werden.

Abschluss

Sie können CSS mithilfe der Jquery CSS () -Methode ändern, die zum Zweck des Abrufens oder der Festlegung von Stileigenschaften eines Elements verwendet wird. Mit dieser Methode können Sie mehrere Stile auf eine HTML auf einmal anwenden, indem Sie die Eigenschaften des CSS -Stils manipulieren. Dieses Tutorial führt Sie dazu, wie Sie CSS auf verschiedene Weise durch JQuery CSS () -Methode verändern können, zusammen mit den relevanten Beispielen für ein besseres Verständnis.