Das jQuery-Objekt in AJAX ist interessant, weil es einfach aus einer Vielzahl von DOM-Elementen für HTML5 und CSS3 Programmierung zu erstellen, und weil es fügt wunderbar, neue Funktionen dieser Elemente.

Wie der Stil eines Elements ändern

Wenn Sie dynamisch die CSS eines Elements ändern können, können Sie eine ganze Menge zu. jQuery macht diesen Prozess ganz einfach. Nachdem Sie ein jQuery-Objekt haben, können Sie mit dem css () Methode hinzufügen oder keine CSS-Attribute des Objekts zu ändern.

Der Code zeigt eine Prägnanz gemeinsam jQuery-Code:

 
Ich bin ein Niveau einer Überschrift
Ich bin ein Absatz mit der ID "myParagraph."
Ich habe eine Grenze.
Ich habe auch eine Grenze.

Sie finden ein paar interessante Dinge in diesem Programm. Zuerst nehmen Sie einen Blick auf die HTML:

• Es enthält ein H1-Tag. Das ist nicht allzu aufregend, aber Sie können es verwenden, um zu zeigen, wie die Elemente von DOM Typ Ziel.

• Es gibt einen Absatz mit der ID myParagraph. Dies wird verwendet, um darzustellen, wie ein Element von ID abzuzielen.

• Es gibt zwei Elemente mit der Klasse. Sie haben keine einfache Möglichkeit, in gewöhnlichen DOM Arbeitscode auf alle Elemente einer bestimmten Klasse zu bewerben, aber jQuery macht es einfach.

• Mehrere Elemente haben benutzerdefinierte CSS, aber kein CSS definiert. Die jQuery-Code ändert sich die ganze dynamisch CSS.

Das drin() Funktion identifiziert wird, wenn die Funktion ausgeführt werden, wenn das Dokument fertig ist. In dieser Funktion wird die leistungsfähige CSS-Methode verwendet, um jedes Element des CSS dynamisch zu ändern. Beachten Sie, wie die verschiedenen Elemente ausgerichtet sind.

Wie man jQuery Objekte auswählen

jQuery bietet mehrere Alternativen für die Erstellung von jQuery Objekte aus den DOM-Elemente. In der Regel verwenden Sie die gleichen Regeln Objekte in jQuery zu wählen, wie Sie in CSS tun:

• DOM-Elemente ausgerichtet sind, wie es ist. Sie können eine beliebige DOM-Element innerhalb der Include $ (# 147- # 148-) Mechanismus alle ähnliche Elemente zu zielen. Verwenden Sie zum Beispiel $ (# 147-h1 # 148-) auf alle H1 Objekte zu beziehen oder $ (# 147-p # 148-)auf alle Absätze zu verweisen.

• Verwenden Sie die Kennung eines bestimmten ID zu zielen. Dies funktioniert genau das gleiche wie in CSS. Wenn Sie ein Element mit der ID meine Sache, Verwenden Sie den Code $ (# 147-Mything # 148-).

• Verwenden Sie die . Identifikator Mitglieder einer Klasse zu zielen. Auch dies ist der gleiche Mechanismus, die Sie in CSS verwenden, so dass alle Elemente mit der Klasse grenzte angebracht, um sie mit dem Code geändert werden $ (# 147-.bordered # 148-).

• Sie können auch komplexe Bezeichner verwenden. Sie können auch komplexe CSS-Bezeichner verwenden, wie $ (# 147-li img # 148-). Diese Kennung nur richtet sich Bilder in einem Listenelement.

Diese Auswahlmethoden (alle von den bekannten CSS-Notation entlehnt) in eine unglaubliche Flexibilität, um Ihren Code. Sie können nun einfach wählen Elemente in Ihren javascript-Code nach den gleichen Regeln, die Sie Elemente in CSS zu identifizieren.

Wie um den Stil zu ändern

Nachdem Sie ein Objekt oder eine Gruppe von Objekten identifiziert haben, können Sie jQuery-Methoden anwenden. Eine sehr leistungsfähige und einfache Methode ist die Methode. Die Grundform dieses css () Methode hat zwei Parameter: eine Stilregel und Wert.

Um zum Beispiel die Hintergrundfarbe aller H1-Objekte gelb zu machen, verwenden Sie folgenden Code:

 $ ( "H1") CSS ( "Backgroundcolor", "gelb"). -

Wenn Sie eine Stilregel zu einer Sammlung von Objekten (wie alle H1 Objekte oder alle Objekte mit der Anwendung grenzte Klasse), wird die gleiche Regel sofort auf alle Objekte angewandt.

Eine leistungsfähigere Variante der Stilregel existiert, können Sie mehrere CSS-Stile anwenden. Es dauert ein einzelnes Objekt in JSON Notation als Argument:

 . $ ( "# MyParagraph") CSS ({ "Backgroundcolor": "schwarz", "Farbe": "weiß"}) -

In diesem Beispiel wird ein JSON-Objekt als eine Reihe von Regel / Wert-Paare definiert.