Dieser Artikel hilft Ihnen beim Einstieg und beim Verständnis der grundlegenden Vorgänge von JQuery

Dieser Artikel hilft Ihnen beim Einstieg und beim Verständnis der grundlegenden Vorgänge von JQuery

1. Schritte zur Verwendung von Jquery:

(1) Importieren Sie die JS-Bibliothek

<script src="js/jquery-1.11.3.min.js"></script>​
//js/jquery-1.11.3.min.js komprimierte Version (empfohlen)
//js/jquery-1.11.3.js Vollversion

(2) Seitenladevorgang

$(Dokument).bereit(Funktion(){
    Geschäftsbetrieb;
});​
//Nach der Optimierung:
$(Funktion(){
    Geschäftsbetrieb;
});

2. Konvertierung zwischen Jq-Objekten und js-Objekten

(1) js-Objekt -----> jq-Objekt

var js-Objekt = document.getElementById("id-Attributwert");
var $jq-Objekt = $(js-Objekt)

(2) jq-Objekt -----> js-Objekt

var js-Objekt = $jq Objekt.get(index);

3.jqs grundlegender Selektor

//(1)jq's ID-Selektor

$("#id Attributwert"). Bindungsereignismethode (function(){
    Geschäftsbetrieb;
});

//(2)jq's Klassenselektor

$("#.class Attributwert"). Bindungsereignismethode (function(){
    Geschäftsbetrieb;
});

//(3) Formularselektor

$("Ausgewähltes Eingabe-Tag [Tag mit angegebenen Attributen]"). Bindungsereignismethode (function(){
    Geschäftsbetrieb;
});

//(4)Elementselektor

$("element/tag").html("XXX");

4.jqs hierarchischer Selektor

//Nachkommenselektor $("übergeordneter Tag untergeordneter Tag")
​
//Unterelement-Selektor $("übergeordnetes Element > untergeordnetes Element")

5. Filterauswahl

$("label:first") // entspricht dem ersten Label $("label:even") // entspricht einer geraden Anzahl von Labels, beginnend bei 0 (0,2,4...)
$("label:odd") //entspricht einer ungeraden Anzahl von Elementen, beginnend bei 1 (1,3,5...)

6. Attributselektoren

[Attribut] //Passt auf Elemente mit dem aktuell angegebenen Attribut an [Attribut=Wert] //Passt auf Elemente mit einem angegebenen Attribut an, das einen bestimmten Wert hat [Attribut!=Wert] //Passt auf alle Elemente an, die das Attribut des angegebenen Elements nicht enthalten oder deren Attribut nicht einem bestimmten Wert entspricht [Attribut^=Wert] //Passt auf bestimmte Elemente an, die mit dem angegebenen Element beginnen [Attribut$=Wert] //Passt auf Elemente an, die mit dem angegebenen Element enden [Attribut*=Wert] //Passt auf Elemente mit angegebenen Attributen an, die bestimmte Werte enthalten ​​[Selektor1][Selektor2]...[SelektorN]
    //Erfüllt den Attributselektor. Elemente, die mehrere Attributbedingungen gleichzeitig erfüllen

7.jq Dokumentenverarbeitung

//Anhängen append(content) //Füge Inhalt an jedes passende Element an (empfohlen)
jq object.appendTo(comtent) //Den übereinstimmenden Inhalt an einen anderen angegebenen Elementsatz anhängen​
//Voranstellen prepend(content) //Jedes passende Element vor den Inhalt setzen prependTo(content) //Alle passenden Elemente einem anderen angegebenen Satz von Elementen voranstellen​
//insertafter(content|fn) //Füge Inhalt nach jedem passenden Element eininsertAfter(content) //Füge die passenden Elemente nach dem Inhalt einbefore(content) //Füge Inhalt vor jedem passenden Element eininsetBefore(content) //Füge jedes passende Element vor dem Inhalt ein

Zusammenfassen

Dieser Artikel endet hier. Ich hoffe, er kann Ihnen helfen. Ich hoffe auch, dass Sie mehr Inhalt auf 123WORDPRESS.COM lesen können!

Das könnte Sie auch interessieren:
  • Tutorial zu den Grundlagen von JavaScript und JQuery Framework
  • Beispiel für die Grundlagen der Verwendung eines jQuery-Selektors
  • jQuery-Grundlagen_Wichtige Wissenspunkte für den Einstieg
  • Tutorial zu den Grundlagen des jQuery-Selektors
  • JQuery Grundlagen Beispiel (1)
  • Lernhandbuch zu den jQuery-Grundlagen

<<:  Einige Indikatoren für exzellentes Web-Frontend-Design

>>:  Neue Einstellungen für Text und Schriftarten in CSS3

Artikel empfehlen

JS asynchroner Code Unit-Test Magie Promise

Inhaltsverzeichnis Vorwort Verkettung von Verspre...

Zusammenfassung der Lösungen für allgemeine Linux-Probleme

1. Centos7 unter VMware verbinden und eine feste ...

CSS3 realisiert den Effekt der kontinuierlichen Dreiecksvergrößerung

1. CSS3-Dreieck vergrößert weiterhin Spezialeffek...

Detaillierte Beschreibung der chinesischen ffmpeg-Parameter

Details zu den Parametern der Version FFMPEG 3.4....

JavaScript implementiert die Klick-Umschaltfunktion

In diesem Artikelbeispiel wird der spezifische Ja...

Implementierung der automatischen Konstruktionsweiterleitung von React

Inhaltsverzeichnis Sequenz 1. Zentralisiertes Rou...

Entwicklungshandbuch für Chrome-Plugins (Erweiterungen) (vollständige Demo)

Inhaltsverzeichnis Vorne geschrieben Vorwort Was ...

Beispiel für eine Routing-Berechtigungsverwaltungsmethode in Vue2/vue3

1. Es gibt im Allgemeinen zwei Methoden zur Steue...

Gängige Stile von CSS-Animationseffekten

Animation Definieren Sie eine Animation: /*Legen ...

Detailliertes Beispiel zum Erstellen und Löschen von Tabellen in MySQL

Der Befehl zur Tabellenerstellung erfordert: Der...

Mehrere Grundsätze für die Produktdesign-Referenz auf Websites

In der folgenden Analyse geht es um Produktdesign...

HTML ist etwas, das Webseiten-Ersteller lernen und beherrschen müssen.

Welche Vorteile bietet das Erlernen von HTML? 1: ...

Warum Google und Facebook Docker nicht verwenden

Der Grund für das Schreiben dieses Artikels beste...