Heim  >  Artikel  >  Web-Frontend  >  Welche Funktionen hat jquery?

Welche Funktionen hat jquery?

藏色散人
藏色散人Original
2020-11-26 11:35:183533Durchsuche

jquery-Funktionen umfassen: 1. „delay(duration,[queueName])“-Funktion; 2. „jQuery live(type, fn)“-Funktion; 4. „position()“; Funktion; 5. Funktion „stop()“ usw.

Welche Funktionen hat jquery?

Empfohlen: „JQuery-Tutorial

  • Diese Methode ist für alle Computermarken geeignet.

Eine Zusammenfassung gängiger JQuery-Funktionen und -Methoden

1.delay(duration,[queueName])

Legen Sie eine Verzögerung fest, um die Ausführung nachfolgender Elemente in der Warteschlange zu verzögern.

Neu in jQuery 1.4. Wird verwendet, um die Ausführung von Funktionen in der Warteschlange zu verzögern. Es kann entweder die Ausführung der Animationswarteschlange verzögern oder in einer benutzerdefinierten Warteschlange verwendet werden.

Dauer: Verzögerungszeit, Einheit: Millisekunden

Warteschlangenname: Warteschlangensubstantiv, der Standardwert ist Fx, Animationswarteschlange.

Beispiel:

Lazy-Loading-Animationseffekt von Kopf und Boden

$(document).ready(function() {
  $('#header') .css({ 'top':-50 }) .delay(1000).animate({'top': 0}, 800);
  $('#footer') .css({ 'bottom':-15 }) .delay(1000).animate({'bottom': 0}, 800); 
});

2.jQuery Live(type, fn) Delegat-Ereignisimplementierung

Neue Methode in Abfrage 1.3. Binden Sie einen Ereignishandler (z. B. ein Klickereignis) an alle aktuellen und zukünftigen übereinstimmenden Elemente. Es können auch benutzerdefinierte Ereignisse gebunden werden.

Unterstützt derzeit Click, Dblclick, Mousedown, Mouseup, Mousemove, Mouseover, Mouseout, Keydown, Keypress, Keyup.

Noch nicht unterstützt: Blur, Focus, MouseEnter, MouseLeave, Change, Submit

Im Gegensatz zu bind() kann live() jeweils nur ein Ereignis binden.

Diese Methode ist der herkömmlichen Bindung sehr ähnlich. Der Unterschied besteht darin, dass durch die Verwendung von Live zum Binden von Ereignissen Ereignisse an alle aktuellen und zukünftigen Elemente auf der Seite gebunden werden (mittels Delegation). Wenn Sie beispielsweise Live verwenden, um Klickereignisse an alle Li auf der Seite zu binden. Wenn dieser Seite in Zukunft ein Li hinzugefügt wird, ist das Klickereignis dieses neu hinzugefügten Li weiterhin verfügbar. Es ist nicht erforderlich, Ereignisse erneut an dieses neu hinzugefügte Element zu binden.

.live() ist dem beliebten liveQuery-Plugin sehr ähnlich, weist jedoch die folgenden Hauptunterschiede auf:

.live unterstützt derzeit nur eine Teilmenge aller Ereignisse. Die Supportliste finden Sie in der Beschreibung oben.

.live unterstützt nicht die von liveQuery bereitgestellte Rückruffunktion im „ereignislosen“ Stil. .live kann nur Event-Handling-Funktionen binden.

.live hat keine „Setup“- und „Cleanup“-Prozesse. Weil alle Ereignisse delegiert und nicht direkt an Elemente gebunden sind. 🔜 hoch . Warum passiert es nach der Live-Nutzung? Dies liegt daran, dass JQuery den Ereignis-Bubbling-Mechanismus verwendet, um das Ereignis direkt an das Dokument zu binden, und dann die Quelle des Ereignisses über event.target findet. Dies unterscheidet sich vom jquery.livequery-Plug-in. jquery.livequery prüft alle 20 Millisekunden und bindet das Ereignis erneut, wenn es ein neues gibt.

Natürlich hat die Verwendung von Live Vor- und Nachteile:

Der Vorteil ist: Sie müssen Ereignisse nicht wiederholt definieren, wenn Elemente aktualisiert werden.

Der Nachteil besteht darin, dass das Binden des Ereignisses an das Dokument für jedes Element auf der Seite einmal aufgerufen wird. Bei unsachgemäßer Verwendung wird die Leistung erheblich beeinträchtigt.

Und Unschärfe, Fokussierung, Mauseingabe, Mausverlassen, Ändern und Senden werden nicht unterstützt.

2. Live-gebundene Ereignisse entfernen

Verwenden Sie in Jquery Live, um Ereignisse zu entfernen, verwenden Sie die Methode „Die“.

Zum Beispiel:

<p class=”myp”></p>

Dadurch wird das gebundene Klickereignis entfernt.

3. JQuery-Methode offset(), position() zum Erhalten absoluter und relativer Positionskoordinaten

Um die absoluten X- und Y-Koordinaten eines Elements auf der Seite zu erhalten, können Sie die Methode offset() verwenden: (body Attributeinstellungsrand: 0 ;padding:0;)

$(“.myp”).live(“click”, function(){
alert(“clicked!”);
});

Zum Beispiel:

$(“.myp”).die("click");

Rufen Sie die relative Position (übergeordnetes Element) ab:

var X = $(&#39;#pID&#39;).offset().top; 
var Y = $(&#39;#pID&#39;).offset().left;

4.jquery, um die Mausposition zu erhalten

$(".produc a span").click(function(){
 $(&#39;body, html&#39;).animate({scrollTop:$(&#39;#buy&#39;).offset().top }, &#39;slow&#39;);
 });

5.jquery zu Bestimmen Sie, ob ein Element eine bestimmte Klasse enthält, ob bestimmte Attribute vorhanden sind und wie bestimmte Attribute entfernt werden.

Bei der JQuery-Codierung beurteilen wir, ob ein Element ein bestimmtes Attribut hat. Ob es beispielsweise den Stil „class="new" enthält, ist sehr einfach, da es die hasClass-Methode $("input[name] gibt =new ]").hasClass("new") kann zur Bestimmung verwendet werden.

Derzeit gibt es keine vorgefertigte Methode. Wenn ein Attribut vorhanden ist $("#aid").attr("rel" ) gibt den Wert von rel zurück. Wenn das Attribut rel nicht existiert, wird „undefiniert“ zurückgegeben. Undefiniert ist der undefinierte Typ, if($("#aid").attr("rel")=="undefiniert" ) Dieses Urteil ist möglicherweise nicht wahr.Weil die Typen unterschiedlich sind.

Es wird empfohlen, if(typeof($("#aid").attr("rel"))=="undefiniert") zu verwenden. jquery entfernt ein Attribut eines jquery-Objekts: $(".main").removeAttr("style");


6 Verwendung von jquery stop() (eine effektive Methode zum Löschen der Animationsanhäufung)

1、stop([stopAll], [gotoEnd])方法有两个参数(当然可以不传或直传一个),其中stopAll的意思是清除之后的所有动画。gotoEnd的意思是,执行完当前动画。

2、stopAll == true时,停止队列中的所有动画, stopAll ==false时,只停止队列中的当前动画,后续动画继续执行。

3、gotoEnd == true时,立即跳到当前动画的末尾, gotoEnd ==false时,停在当前状态。且gotoEnd只有在设置了stopAll的时候才起作用

4、在项目中,如果不进行动画队列清理,就会产生动画积累的问题。因此在写入动画时,最好先清除队列中的重复动画。

在项目中,例如做下拉二级导航效果,用到jquery的slideDown()与slideUp()方法,当鼠标快速晃动后,如果不进行动画队列清理,就会产生动画积累,出现问题。

例如:

$(".nav li.has_list").hover(function(){
  $(this).children("a").addClass("curr");
  $(".nav li.has_list").children("p").stop(false,true);
  $(this).children("p").slideDown(400).end();              
},function(){
  $(this).children("a").removeClass("curr");
  $(".nav li.has_list").children("p").stop(false,true);
  $(this).children("p").slideUp(400).end();
  }
);

以上内容就是本文关于jquery常用函数与方法汇总,希望大家喜欢。

Das obige ist der detaillierte Inhalt vonWelche Funktionen hat jquery?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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