标签：html 需要 tin bind body 对象关联 this 一个 检索
clearQueue([queueName]) 从队列中移除任未运行的项目
queueName：可选。字符串值，包含序列名称。默认是fx，标准的效果序列。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> div { margin: 3px; width: 40px; height: 40px; position: absolute; left: 0px; top: 30px; background: green; display: none; } div.newcolor { background: blue; } </style> <script src="http://code.jquery.com/jquery-latest.js"></script> </head> <body> <button id="start">Start</button> <button id="stop">Stop</button> <div></div> <script> $("#start").click(function() { var myDiv = $("div"); myDiv.show("slow"); myDiv.animate({ left: ‘+=200‘ }, 5000); myDiv.queue(function() { var _this = $(this); _this.addClass("newcolor"); _this.dequeue(); }); myDiv.animate({ left: ‘-=200‘ }, 1500); myDiv.queue(function() { var _this = $(this); _this.removeClass("newcolor"); _this.dequeue(); }); myDiv.slideUp(); }); $("#stop").click(function() { var myDiv = $("div"); myDiv.clearQueue(); myDiv.stop(); }); </script> </body> </html>
queue([queueName]) 显示或操作在匹配元素上执行的函数队列
queueName：可选。字符串值，包含序列名称。默认是fx，标准的效果序列。
每个元素可拥有一到多个由jQuery 添加的函数队列。在大多数应用程序中，只使用一个队列（默认名为 fx）。队列运行在元素上异步地调用动作序列，而不会终止程序执行。
$(‘#foo‘).slideUp().fadeIn();
.queue() 方法允许我们直接对这个函数队列进行操作。调用带有回调函数的 .queue() 方法特别有用；它允许我们在队列末端放置一个新函数。
$(‘#foo‘).slideUp(); $(‘#foo‘).queue(function() { alert(‘Animation complete.‘); $(this).dequeue(); });
当通过 .queue() 添加函数时，我们应当确保最终调用了 .dequeue()，这样下一个排队的函数才能执行。
dequeue([queueName]) 终止一个自定义的队列函数
queueName：可选。字符串值，包含序列名称。默认是fx，标准的效果序列。
当调用 .dequeue() 时，会从序列中删除下一个函数，然后执行它。该函数反过来会（直接或间接地）引发对 .dequeue() 的调用，这样序列才能继续下去。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> div { margin: 3px; width: 50px; position: absolute; height: 50px; left: 10px; top: 30px; background-color: yellow; } div.red { background-color: red; } </style> <script src="http://code.jquery.com/jquery-latest.js"></script> </head> <body> <button>Start</button> <div></div> <script> $("button").click(function() { $("div").animate({ left: ‘+=200px‘ }, 2000); $("div").animate({ top: ‘0px‘ }, 600); $("div").queue(function() { $(this).toggleClass("red"); $(this).dequeue(); }); $("div").animate({ left: ‘10px‘, top: ‘30px‘ }, 700); }); </script> </body> </html>
data() 想元素附加数据，然后取回该数据
$(selector).data(name) 从元素返回数据：
name 可选。规定要取回数据的名称。如果没有规定名称，则该方法将以对象的形式从元素中返回所有存储的数据。
$(selector).data(name,value) 向元素附加数据：
name 必须。规定要设置的数据名称。
value 必须。规定要设置的数据值。
$(selector).data(object) 使用对象向元素附加数据：
object 必须。规定包含名称/值对的对象。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> div { color: blue; } span { color: red; } </style> <script src="http://code.jquery.com/jquery-latest.js"></script> </head> <body> <div> The values stored were <span></span> and <span></span> </div> <script> $("div").data("test", { first: 16, last: "pizza!" }); $("span:first").text($("div").data("test").first); $("span:last").text($("div").data("test").last); </script> </body> </html>
hasData() 方法检测元素是否拥有与之相关的任何 jQuery 数据
jQuery.hasData(element)：
element 一个用于检测数据的DOM元素。
false ;否则返回true 。<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script src="http://code.jquery.com/jquery-latest.js"></script> </head> <body> <p>Results: </p> <script> var $p = jQuery("p"), p = $p[0]; $p.append(jQuery.hasData(p) + " "); /* false */ $.data(p, "testing", 123); $p.append(jQuery.hasData(p) + " "); /* true*/ $.removeData(p, "testing"); $p.append(jQuery.hasData(p) + " "); /* false */ $p.on(‘click‘, function() {}); $p.append(jQuery.hasData(p) + " "); /* true */ $p.off(‘click‘); $p.append(jQuery.hasData(p) + " "); /* false */ </script> </body> </html>
removeData() 在元素上移除绑定的数据
removeData( [name] )：
name：要移除的存储数据名。
removeData( [list] )：
list：一个数组或空间分隔的字符串命名要删除的数据块。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> div { margin:2px; color:blue; } span { color:red; } </style> <script src="http://code.jquery.com/jquery-latest.js"></script> </head> <body> <div>value1 before creation: <span></span></div> <div>value1 after creation: <span></span></div> <div>value1 after removal: <span></span></div> <div>value2 after removal: <span></span></div> <script> $("span:eq(0)").text("" + $("div").data("test1")); $("div").data("test1", "VALUE-1"); $("div").data("test2", "VALUE-2"); $("span:eq(1)").text("" + $("div").data("test1")); $("div").removeData("test1"); $("span:eq(2)").text("" + $("div").data("test1")); $("span:eq(3)").text("" + $("div").data("test2")); </script> </body> </html>
整理学习，在运用中掌握，有些知识不见得一下子通透，但必须做到先了解。
标签：html 需要 tin bind body 对象关联 this 一个 检索
原文地址：http://www.cnblogs.com/momei/p/7224223.html
