Heim > Web-Frontend > js-Tutorial > Hauptteil

Erklärung zu jquery DOM&events

jacklove
Freigeben: 2018-05-21 10:39:14
Original
1373 Leute haben es durchsucht

JQuery-DOM&-Ereignisse werden beim Lernen häufig angetroffen. In diesem Artikel werden JQuery-DOM&-Ereignisse ausführlich erläutert.

Was ist der Unterschied zwischen einer Bibliothek und einem Framework?

Die Bibliothek bietet viele Methoden, die verschiedenen kleinen Werkzeugen im Lager entsprechen. Sie können sie direkt verwenden, wenn Sie Werkzeuge benötigen.

Das Gerüst ist lediglich ein aufgestelltes Regal. Der Hauptkörper wurde festgelegt und muss nur noch mit verschiedenen Werkzeugen gefüllt werden.

Was kann jquery? Was ist der Unterschied zwischen JQuery-Objekten und DOM-nativen Objekten? Wie konvertieren?

jquery kann HTML-Text durchqueren, DOM-Knoten bedienen, Ereignisse, Animationen und Ajax-Funktionen verarbeiten, sodass Sie es auf mehr Plattformen verwenden können, ohne die Kompatibilität zu berücksichtigen.
Funktionen sind: leichtgewichtig (32 KB), kompatibel mit CSS3, browserübergreifend,

Der Unterschied zwischen jquery-Objekten und DOM-nativen Objekten besteht darin, dass jqery-Objekte umhüllte Objekte nativer Objekte sind. Sie haben einige Für JQuery-Objekte spezifische Methoden sind sehr praktisch.

Eine direkte Abfrage mit der Array-Methode ([Indexnummer-Index]) wird in ein natives DOM-Objekt umgewandelt. Wenn die eq-Methode verwendet wird, ist das Ergebnis auch ein Abfrageobjekt. Um ein natives Objekt in ein JQuery-Objekt umzuwandeln, müssen Sie es nur mit $() umschließen.
Zum Beispiel:

jquery object to native> $(#head)[0]

native object to jquery> $(native object)

jquery How to Ereignisse binden? Welche Funktionen haben Bind, Unbind, Delegate, Live, On und Off? Welches ist empfehlenswert? Wie verwende ich on, um Ereignisse zu binden und den Ereignis-Proxy zu verwenden?

Sie können Ereignisse in jquery wie folgt binden:

$("button").click(function() {
    alert(1);
} );
$("button").bind('click', function(e){    console.log(e);
    alert(2);
});
$("button").on('click', function(){    console.log(e);    console.log(this);    console.log($(this));
});
Nach dem Login kopieren

bind Fügen Sie dem Element ein Bindungsereignis hinzu (es wird empfohlen, nach Version 1.7 on anstelle von bind zu verwenden)

unbind Unbind Ein Elementbindungsereignis (Methode, die vor Version 1.7 verwendet wurde)

delegate entspricht einem Ereignis-Proxy (Element kann angegeben werden), um dem Element ein oder mehrere Bindungsereignisse hinzuzufügen (es wird empfohlen, stattdessen on zu verwenden). nach Version 1.7)

live entspricht der Verwendung eines Ereignis-Proxys (für den Wurzelknoten), dem Hinzufügen eines oder mehrerer Bindungsereignisse zum Element (nach Version 1.7 abgeschafft, ersetzt durch on)

on für das ausgewählte Element und Hinzufügen eines oder mehrerer Event-Handler zu untergeordneten Elementen (die am meisten empfohlene Methode)

off wird verwendet, um den von der .on()-Methode hinzugefügten Event-Handler zu entfernen

on () Die Methode vereinheitlicht die oben genannten Methoden, daher wird jetzt empfohlen, die .on()-Methode zu verwenden, die wie folgt geschrieben ist:

$( "#members" ).on( "click",li a",function ( e ) {} );
Beachten Sie hier, dass die Position des untergeordneten Elements nach dem Klicken liegt, was bedeutet, dass ein Ereignis-Proxy verwendet wird

Wie wird JQuery angezeigt/versteckt? Elemente? Wie verwende ich eine JQuery-Animation?

Element anzeigen: $(selector).show(speed,callback);

Element ausblenden: $(selector).hide(speed,callback);

Zeigen und Umschalter ausblenden: $(selector).toggle(speed,callback);

Ein- und Ausblenden:

$(selector).fadeIn(speed,callback); //淡入
$(selector).fadeOut(speed,callback); //
淡出$(selector).fadeToggle(speed,callback); //
淡入淡出切换$(selector).fadeTo(speed,opacity,callback);  //渐变到透明度
Nach dem Login kopieren

Ein- und Ausblenden:

$(selector).slideDown (speed,callback); //Slide in$(selector).slideUp(speed,callback); //Slide out$(selector).slideToggle(speed,callback); //Switch

optional Der Geschwindigkeitsparameter gibt die Geschwindigkeit des Ein-/Ausblendens an und kann die folgenden Werte annehmen: „langsam“, „schnell“ oder Millisekunden.
Der optionale Callback-Parameter ist der Name der Funktion, die ausgeführt werden soll, nachdem das Ein- oder Ausblenden abgeschlossen ist.

jquery animation $(selector).animate({parmas},speed,callback);

params sind erforderliche Parameter und die CSS-Eigenschaften der Animation. Geschwindigkeit ist ein optionaler Parameter, der die Dauer des Animationseffekts angibt und den Wert langsam, schnell oder Millisekunden annimmt. classback ist die Funktion, die nach Abschluss der Animation ausgeführt wird.

Wie kann man den HTML-Inhalt in einem Element festlegen und abrufen? Wie kann ich den inneren Text eines Elements festlegen und abrufen?

HTML-Inhalt festlegen oder abrufen: $(selector).html()

Textinhalt festlegen oder abrufen: $(selector).text()

Es gibt Parameter, die darstellen Einstellungen, keine Parameter stellen die Erfassung dar.

Wie kann der vom Formularbenutzer eingegebene oder ausgewählte Inhalt festgelegt und abgerufen werden? Wie werden Elementeigenschaften festgelegt und abgerufen?

Legen Sie den Formularbenutzereingabeinhalt $('#input').val() fest oder rufen Sie ihn ab

Legen Sie den Formularauswahlinhalt $('input:checked') oder $(' fest oder rufen Sie ihn ab :checked ')

Elementattribute festlegen oder abrufen $("div").attr(e,d) e stellt die Erfassung dar, d stellt das Attribut dar, das festgelegt werden muss, und wenn es leer ist, stellt es dar Erfassung

Holen Sie sich die Bandelemente mit einem bestimmten Attribut $('[data-img]') oder $('[data-img="xxx"]')

Dieser Artikel erklärt JQuery Weitere Informationen zu DOM&Events finden Sie auf der chinesischen PHP-Website.

Verwandte Empfehlungen:

Einige verwandte modulare Grundlagen

Was ist der Unterschied zwischen innerText und innerHTML von Dom-Objekten?

Einige grundlegende Fragen zu JS

Das obige ist der detaillierte Inhalt vonErklärung zu jquery DOM&events. 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
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!