Heim > Web-Frontend > js-Tutorial > Hauptteil

Jquery ruft die Einstellung und Entfernung des Objekts und der Attribute des angegebenen tag_jquery ab

WBOY
Freigeben: 2016-05-16 16:46:23
Original
1561 Leute haben es durchsucht

1. Lassen Sie uns zunächst über das Konzept von JQuery sprechen. JQuery wurde zuerst von einem Mann namens John Resig aus Amerika entwickelt. Später schlossen sich auch viele JS-Experten dem Team an. Tatsächlich ist JQuery eine JavaScript-Klassenbibliothek, die viele funktionale Methoden integriert. Mit der Klassenbibliothek können Sie einige einfache Codes verwenden, um einige komplexe JS-Effekte zu erzielen.

2. JQuery realisiert die Trennung von Codes. Es ist nicht erforderlich, Ereignisse wie onclick zur Webseite hinzuzufügen, um die JQuery-Klassenbibliothek und den von Ihnen selbst geschriebenen JQuery-Code direkt einzuführen 🎜> Zum Beispiel:

Code kopieren Der Code lautet wie folgt:
$(function( ){
$ ("Element").click{
function(){ warning("Click me!"}
}

);
Solange im obigen Code Element definiert ist, ist der Klick hinter diesem Element die Aktionswarnung („Klicken Sie auf mich!“). Natürlich können Sie dies tun viele Operationen in dieser Funktion;

Das $-Zeichen steht hier für JQuery, was eine Referenz auf die Klassenbibliothek ist. . . So verstehe ich es;

3. Einige der Kernmethoden von JQuery

each(callback) 'Wie eine Schleife

$("Element").length ; ' Die Anzahl der Elemente ist ein Attribut

$(“Element”).size(); 'Es ist auch die Anzahl der Elemente, aber mit Klammern ist es eine Methode

$( „Element“).get (); 'Eine Sammlung von Elementen auf der Seite, gespeichert in Form eines Arrays

$("Element").get(index); 'Die Funktion ist dieselbe wie oben stellt der Index das Element dar, Array index

$(“Element”).get().reverse(); 'Ändern Sie die erhaltene Array-Richtung

$(“Element1″).index ($(“Element2 ″)); 'Der Indexwert von Element 2 in Element 1 ist. . .

4. Grundlegende Objekterfassung

$(“*”) ‘Gibt an, alle Objekte abzurufen

$(“#element”) ‘Die gleiche ID-Nummer wie in CSS abrufen

$(".abc") 'Alle Elemente im .abc-Stil

$("div") 'Der Tag-Selektor wählt alle div-Elemente aus

$( "# a,.b,span") 'Gibt an, dass das Element mit der ID a, das Element mit Klassenstil b und alle span-Elemente abgerufen werden

$("#a .b p") 'Die ID-Nummer ist a und verwendet alle p-Elemente des b-Stils

5. Hierarchische Elemente erhalten

$("Element1 Element2 Element3 ....") 'Dem übergeordneten Element folgt die Teilmenge

$("div > p") 'Alle p-Elemente unterhalb des div abrufen

$("div p") 'Das erste p-Element nach dem div-Element

$("div ~ p") 'Alle p Elemente nach div

6. Einfache Objekterfassung

$("Element:first") 'Das erste Element eines bestimmten Elementtyps in der HTML-Seite An element

$("Element:last") 'Das letzte Element eines bestimmten Elementtyps in der HTML-Seite

$("Element:not(selector)") 'Alle Elemente entfernen mit dem angegebenen Geben Sie die vom Selektor übereinstimmenden Elemente an, z. B.: $("input:not(:checked)") bedeutet, dass alle deaktivierten Kontrollkästchen ausgewählt werden

$("Element:even") 'Gerade Zeilen abrufen

$("Element:odd") 'Ungerade Zeilen abrufen

$("Element:eq(index)") 'Einen gegebenen Indexwert abrufen

$(" Element:gt(index)") 'Alle Elemente nach dem Element mit einem bestimmten Indexwert abrufen

$("Element:lt(index)") 'Alle Elemente vor dem Element mit einem bestimmten Indexwert abrufen

. . .

7. Erhalten von Inhaltsobjekten und Objektsichtbarkeit

$("Element:contains(text)") 'Ob das Element Textinhalt enthält

$(' Element:empty ") 'Holen Sie sich das

$("Element:partnt") 'Holen Sie sich das

$("Element:has (selector)") 'Ob es ein bestimmtes Element enthält, wie zum Beispiel: $("p:has(span)") bedeutet alle p-Elemente, die span-Elemente enthalten

$("Element:hidden") 'Alle sichtbaren Elemente auswählen

$(“Element:visible” ) 'Alle unsichtbaren Elemente auswählen

8. Andere Objekterfassungsmethoden

$(“Element[id]“) ' Alle Elemente mit ID-Attributen

$("Element[ attribute = youlika ]" 'Alle Elemente mit einem Attribut von youlika abrufen

$("Element[attribute != youlika ]" 'Alle Elemente abrufen, deren Attribut nicht youlika ist

$(" Element[attribute ^= youlika]" 'Alle Elemente abrufen, deren Attribut nicht youlika ist

$(" Element[attribute $= youlika ]" 'Alle Elemente mit einem Attribut abrufen, das nicht mit youlika
$("Element[attribute *= youlika ]" 'Alle Elemente mit einem Attribut abrufen, das mit youlika beginnt

$("Element[selector1][selector2][....]") 'Entspricht dem Attributselektor, z. B. $("input[id][name][value=youlika]") bedeutet, die Eingabeelemente mit ID, Name und Wert zu erhalten youlika

9 elements

$("Element:nth-child(index)") 'Wählen Sie das unter dem übergeordneten Element aus. Das n-te Element

$("Element:nth-child(even)"). 'Wählen Sie die gerade Zahl unter dem übergeordneten Element aus

$("Element:nth-child(odd)") ' Wählen Sie die ungerade Zahl unter dem übergeordneten Element

$(“Element:nth-child( 3n 1)“) 'Ausdruck

$(“Element:first-child”) 'Wählen Sie die ungerade Zahl unter dem übergeordneten Element aus. Das erste untergeordnete Element

$(“Element:last-child“ ) 'Wählen Sie das letzte untergeordnete Element unter dem übergeordneten Element aus

$("Element:only-child") 'Match Das einzige untergeordnete Element unter dem übergeordneten Element, z. B. dt, ist dann das einzige in der dl-Liste dt

10. Holen Sie sich das Formularobjekt

$(:input)//Alle Eingabeelemente finden, einschließlich Dropdown-Listen, Textfelder, Optionsfelder, Kontrollkästchen usw .

$(:text)//Alle einzeiligen Textfelder abgleichen

$(:password)//Alle Passwortfelder abgleichen

$(:radio)// Passt zu allen Optionsfeldern

$(:checkbox)//Passt zu allen Kontrollkästchen

$(:submit)//Passt zu allen Senden-Buttons

$ (:image)/ /Übereinstimmen Sie alle Bildfelder, z. B.

$(:reset)//Übereinstimmen Sie alle Reset-Schaltflächen

$ (:button)//Übereinstimmen alle Schaltflächen

$(:file)//Alle Datei-Upload-Domänen abgleichen

$(:hidden)//Alle unsichtbaren Elemente oder Typen abgleichen Für ausgeblendete Elemente

$( :enabled)//alle verfügbaren Eingabeelemente abgleichen, zum Beispiel radio:enabled bedeutet, dass alle verfügbaren Optionsfelder übereinstimmen

$(:disabled)//alle nicht verfügbaren Eingabeelemente abgleichen haben den gegenteiligen Effekt wie oben

$(:checked)//Alle ausgewählten Kontrollkästchenelemente abgleichen

$(:selected)//Alle Dropdown-Listen abgleichen

11. Elementattribute festlegen und entfernen

$("Element").attr(name) 'Den ersten passenden Attributwert abrufen, z. B. $("img")

$(“Element”.attr (key,value)“) 'Attribute für ein bestimmtes Element festlegen

$(“Element”.attr({key:value ,key1:value,….})) 'Mehrere Attribute für ein Element festlegen unter Once

$(“Element”).attr(key,function) 'Setze ein berechnetes Attribut für alle übereinstimmenden Elemente. Attributwert

$(“Element”).removeAttr(name)/ /Entferne ein Attribut
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage