Heim > Web-Frontend > js-Tutorial > Zusammenfassung der Anwendungsbeispiele verschiedener Datentypen in JQuery

Zusammenfassung der Anwendungsbeispiele verschiedener Datentypen in JQuery

伊谢尔伦
Freigeben: 2017-06-19 10:44:36
Original
1235 Leute haben es durchsucht

In diesem Artikel werden hauptsächlich Beispiele für mehrere häufig verwendete Datenverarbeitungsmethoden in jQuery vorgestellt und einige Vorschläge und Referenzen für Anfänger bereitgestellt.

1.clearQueue()

从序列中删除仍未运行的所有项目
.clearQueue(queueName)
$("div").clearQueue();//清空队列
Nach dem Login kopieren

2.data()

Daten an das ausgewählte Element anhängen oder Daten vom ausgewählten Element abrufen

$(selector).data(name)//如果没有规定名称,则该方法将以对象的形式从元素中返回所有存储的数据
$(selector).data(name,value)向被选元素附加数据
$("#btn1").click(function(){
  $("div").data("greeting", "Hello World");
});
$("#btn2").click(function(){
  alert($("div").data("greeting"));
});
//向元素附加数据,然后取回该数据
Nach dem Login kopieren

3. .dequeue()

Führen Sie die nächste Funktion in der Sequenz für das übereinstimmende Element aus

.dequeue(queueName)
$("div").queue(function () {
  $(this).toggleClass("red");
  $(this).dequeue();
});//使用 dequeue() 终止一个自定义的队列函数
Nach dem Login kopieren

4. jQuery.hasData()

Erkennung, ob mit dem Element jQuery-Daten verknüpft sind

jQuery.hasData(element)//可选。需要检查其数据的 DOM 元素
$(function(){
  var $p = jQuery("p"), p = $p[0];
  $p.append(jQuery.hasData(p)+" "); /* false */
  jQuery.data(p, "testing", 123);
  $p.append(jQuery.hasData(p)+" "); /* true */
  jQuery.removeData(p, "testing");
  $p.append(jQuery.hasData(p)+" "); /* false */
});//在元素上设置数据,然后查看 hasData 的结果
Nach dem Login kopieren

Die Methode Query.hasData() erkennt mithilfe von jQuery.data(), ob für das Element derzeit ein Wert festgelegt ist. Wenn keine Daten zum Element vorhanden sind (es existiert überhaupt kein Datenobjekt oder das Datenobjekt ist leer), gibt die Methode „false“ zurück, andernfalls gibt sie „true“ zurück.

Der Hauptvorteil von jQuery.hasData(element) ist Wenn kein Datenobjekt vorhanden ist, wird das Datenobjekt nicht erstellt und dem Element zugeordnet. Im Gegenteil, jQuery.data(element) gibt das Datenobjekt immer an den Aufrufer zurück, wenn es vorher nicht existiert, wird es erstellt

5.queue()

Funktionswarteschlange anzeigen oder bedienen, die auf übereinstimmenden Elementen ausgeführt wird

.queue(queueName)//字符串值,包含序列的名称。默认是 fx, 标准的效果序列
function showIt() {
  var n = div.queue("fx");
  $("span").text( n.length );      
  setTimeout(showIt, 100);
}//显示队列的长度
$('#foo').slideUp().fadeIn();//当这条语句执行时,元素会立即开始其滑动动画,但是淡入过渡被置于 fx 队列,只有当滑动过渡完成后才会被调用
Nach dem Login kopieren

Diese Funktion ähnelt der Animationsmethode und stellt eine Rückruffunktion bereit, es ist jedoch nicht erforderlich, bei der Animation eine Rückruffunktion festzulegen wird ausgeführt:

$('#foo').slideUp();
$('#foo').queue(function() {
  alert('Animation complete.');
  $(this).dequeue();
});
Nach dem Login kopieren

Entspricht:

$('#foo').slideUp(function() {
  alert('Animation complete.');
});
Nach dem Login kopieren

Beim Hinzufügen von Funktionen über .queue() sollten wir sicherstellen, dass .dequeue() schließlich aufgerufen wird, damit die nächste Funktion in der Warteschlange steht kann ausgeführt werden

5. Die Methode .removeData()

löscht die zuvor über die Methode data() gesetzten Daten

$(selector).removeData(name)//如果没有规定名称,该方法将从被选元素中删除所有已存储的数据
$("#btn2").click(function(){
  $("div").removeData("greeting");
  alert("Greeting is: " + $("div").data("greeting"));
});//从元素中删除之前添加的数据
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonZusammenfassung der Anwendungsbeispiele verschiedener Datentypen 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