Heim > Web-Frontend > js-Tutorial > Hauptteil

Einführung in einige häufig verwendete Methoden in jQuery

零下一度
Freigeben: 2017-06-26 15:15:17
Original
1098 Leute haben es durchsucht

1. Ebenenselektor
Nachkommenselektor „Übergeordnetes Element Nachkommendes Element“

Zum Beispiel: $("div p") wählt alle p-Elemente unter dem div-Element aus


Selektor für untergeordnete Elemente „Übergeordnetes Element> Untergeordnetes Element“

Zum Beispiel: $("div>p") wählt das p-Element im untergeordneten Element von div aus


Erstes rückwärtsgeordnetes Element Elemente „Elementname + Geschwisterelement“

Zum Beispiel: $("div+p") wählt das erste p-Element nach dem div-Element aus


alles rückwärts Bruderelement „Elementname ~ Brother-Element"

Zum Beispiel: $("div~p") wählt alle p-Elemente nach dem div-Element aus


2. Filterselektor
:first             $(" p:first")                                                                    "p: gt(1)"); Alle

-Elemente
mit Zahlen größer als 1 :eq $("p:eq(1)"); Alle

🎜> mit Zahlen gleich 1 :odd $( "td:odd"); Alle Elemente
mit ungeraden Zahlen :even $("td:even"); Alle Elemente
mit geraden Zahlen :not $("p :not(.notr)") Alle

-Elemente auswählen
, die nicht den Klassennamen notr haben
Nach Inhalt filtern
:contains(content)
:empty()


Filter basierend auf Anzeige

:hidden Ausgeblendete Elemente auswählen (display:none oder type="hidden" oder das übergeordnete Element ausblenden oder die Länge und Breite sind 0 , diese Elemente sind versteckte Elemente)

:visible


3. Formularauswahl

:input

:text
:button
:file
:radio
:submit

4. Attribut - Filterselektor
[Attributname] Wählen Sie das Element mit diesem Attribut aus
[Attributname='Wert'] Wählen Sie das Element
mit dem Attribut aus gleich einem bestimmten Wert [ Attributname!='Wert'] Wählen Sie das Element aus, dessen Attribut nicht einem bestimmten Wert entspricht

Zum Beispiel: $("input[name='newlatter']"); das Eingabeelement, dessen Namensattribut newlatter ist

5. Formularattributselektor
Verwendung: aktiviert :ausgewählt :aktiviert :deaktiviert zum Filtern von Elementen
Vereinfachung des Attributfilterselektors
Zum Beispiel: $( ":radio:checked")                                                                                                                                kann alle ausgewählten Radioelemente auswählen
                                                                 ‐                      kann alle ausgewählten Optionselemente auswählen

    🎜> attr("Attribute name") Attribut abrufen Attr("Attribute name ", Attributwert) Attribut

setzen removeAttr("Attribute name") Attribut
entfernen


7. Methoden zum Abrufen und Festlegen des Wertattributs
val() und val("value")

8. html() html("value")
html ( ) entspricht innerHTML
html("value") entspricht innerHTML="value"

text() text("value")
text() entspricht innerText()
text("value") entspricht innerText="value"


9. Stilfunktion
css("name of style") Ruft den Wert ab, der dem Stil
css(" entspricht Name des Stils“, „Stil Der Wert von“) Legen Sie den entsprechenden Stil fest Legen Sie jeweils einen
fest css({"Name des Stils": "Wert des Stils", "Name des Stils": "Wert des Stils" }) Legen Sie mehrere Stile gleichzeitig fest

addClass("class name") Fügen Sie einen Wert hinzu, der dem Klassenattribut entspricht
removeClass("class name") Löschen Sie den Wert, der dem Klassenattribut entspricht
toggleClass("Klassenname") Switch

width() Holen Sie sich die Breite
height() Holen Sie sich die Höhe
innerWidth() Holen Sie sich die Breite (einschließlich Polsterung)
äußereWidth() Holen Sie sich die Breite (einschließlich Polsterung und Rand)
äußereWidth(true) Ermittelt die Breite (einschließlich Polsterung, Rand und äußerer Rand)


10. Funktionen ein- und ausblenden
show() show
hide() hide
toggle() switch
show(speed) Innerhalb der angegebenen Zeit anzeigen
hide(speed) Innerhalb der angegebenen Zeit ausblenden
toggle(speed) Innerhalb der angegebenen Zeit umschalten

slideUp(speed) slideUp(speed) innerhalb der angegebenen Zeit Innerhalb der angegebenen Zeit nach oben verkleinern
slideDown(speed) Innerhalb der angegebenen Zeit nach unten erweitern
slideToggle(speed) Die beiden oben genannten Zustände innerhalb der angegebenen Zeit umschalten Zeit

fadeIn(speed) fadeIn(speed) innerhalb der angegebenen Zeit Einblenden innerhalb der Zeit
fadeOut(speed) Ausblenden innerhalb der angegebenen Zeit
fadeToggle(speed) Wechseln Sie die beiden oben genannten Zustände

11. Benutzerdefinierte Animation
Selector.animate({" Parameters"},[time],[animation callback function]);
 
$(document).ready(function(){
>   $("div").animate({
   left:'250px',
   opacity:'0.5',
      height:'150px',
   width:'150px'
} ,2000);
 });
 });


12. Bindungsereignisse
Selector.bind("event", Ereignishandler); Ereignis des zuzuordnenden Elements Für die entsprechende Event-Handler-Funktion wird empfohlen, on
selector.unbind("event"); zu verwenden, um das Ereignis des Elements von der entsprechenden Handler-Funktion zu trennen. Es wird empfohlen, off
selector.trigger("event" zu verwenden "); Ereignisaufruf auslösen

Häufig verwendete Ereignisfunktionen erstellen:
click(fn)/click()
DBLCLICK (Fn)/DBLCLICK ()
Unschärfe (Fn)/Unschärfe ()
Fokus (Fn)/Fokus ()
Ändern (Fn)/Ändern ()
Keydown (Fn)/Keydown " laden (fn)/unload(fn)

Zum Beispiel: $("div").click(function(e){});//e ist das Ereignisobjekt


$("div").bind("click",function(){});


13. Häufig verwendete Attribute und Methoden des Ereignisobjekts
Zielereignis Quelle
Seite ){
                   Alert(e.pageX+":"                   e.pageY); Beim Weggehen wird die Out-Funktion ausgelöst


15. Dynamische Ereignisfunktion
on (Ereignistyp, Selektor, Verarbeitungsfunktion)
Sie können die aktuellen und zukünftigen Werte eines Elements angeben. Ereignisse an Elemente binden, die dem Selektor entsprechen

Zum Beispiel: $("table" ).on("click","tr",function(){
//Ereignisverarbeitungslogik
} ; Interner vorangestellter Inhalt
after() Inhalt nach jedem passenden Element einfügen
before() Inhalt vor jedem passenden Element einfügen
remove() Knoten entfernen
empty() Knoten leeren
clone() Knotenelemente kopieren
clone(true) Knotenelemente und gebundene Ereignishandler kopieren
children( ) Untergeordnete Elemente finden
next() Nachfolgende Geschwisterelemente finden
prev( ) Vorherige Geschwisterelemente suchen
siblings() Geschwisterelemente suchen
find(selector) Untergeordnete Elemente und Nachkommenelemente
parent finden () Übergeordnetes Element finden
parent(selector) Vorfahrenelemente finden
eq(index) Gibt das jQuery-Objekt
bei index+1 zurück first() Ruft das erste Element ab
last() Ruft das letzte Element ab
is(expr) Bestimmt, ob das Element die Ausdrucksbedingung erfüllt
not(expr) Gibt Elemente zurück, die bestimmte Bedingungen nicht erfüllen
get(index) Ruft eines der passenden DOM-Elemente ab

17. Hilfsfunktion
$.each(object,[callback])
Traversal-Methode, die zum Durchlaufen von Arrays und Objekten verwendet wird
erstes, zweites)
Zwei Arrays zusammenführen, die beiden Arrays mit dem ersten zusammenführen array
$.trim(str)
Entfernen Sie die Leerzeichen am Anfang und Ende der Zeichenfolge


Das obige ist der detaillierte Inhalt vonEinführung in einige häufig verwendete Methoden in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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