jquery中几种数据的实例用法汇总
程序员文章站
2022-05-12 15:51:36
...
这篇文章主要介绍了jQuery常用几种数据处理方法的实例介绍,给初学的朋友们一些建议参考。
1.clearQueue()
从序列中删除仍未运行的所有项目 .clearQueue(queueName) $("div").clearQueue();//清空队列
2. .data()
向被选元素附加数据,或者从被选元素获取数据
$(selector).data(name)//如果没有规定名称,则该方法将以对象的形式从元素中返回所有存储的数据 $(selector).data(name,value)向被选元素附加数据 $("#btn1").click(function(){ $("div").data("greeting", "Hello World"); }); $("#btn2").click(function(){ alert($("div").data("greeting")); }); //向元素附加数据,然后取回该数据
3. .dequeue()
为匹配元素执行序列中的下一个函数
.dequeue(queueName) $("div").queue(function () { $(this).toggleClass("red"); $(this).dequeue(); });//使用 dequeue() 终止一个自定义的队列函数
4. jQuery.hasData()
检测元素是否拥有与之相关的任何 jQuery 数据
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 的结果
Query.hasData() 方法检测元素当前是否拥有通过使用 jQuery.data() 设置的任何值。如果没有数据与元素相关(根本不存在数据对象或者数据对象为空),则该方法返回 false;否则返回 true
jQuery.hasData(element) 的主要优势是,在不存在数据对象的情况下,不会创建并将数据对象与元素进行关联。相反地,jQuery.data(element) 总是向调用者返回数据对象,如果之前数据对象不存在,则会创建它
5. .queue()
显示或操作在匹配元素上执行的函数队列
.queue(queueName)//字符串值,包含序列的名称。默认是 fx, 标准的效果序列 function showIt() { var n = div.queue("fx"); $("span").text( n.length ); setTimeout(showIt, 100); }//显示队列的长度 $('#foo').slideUp().fadeIn();//当这条语句执行时,元素会立即开始其滑动动画,但是淡入过渡被置于 fx 队列,只有当滑动过渡完成后才会被调用
这个特性与动画方法提供回调函数类似,但是无需在动画执行时设置回调函数:
$('#foo').slideUp(); $('#foo').queue(function() { alert('Animation complete.'); $(this).dequeue(); });
等价于:
$('#foo').slideUp(function() { alert('Animation complete.'); });
当通过 .queue() 添加函数时,我们应当确保最终调用了 .dequeue(),这样下一个排队的函数才能执行
5. .removeData()
法删除之前通过 data() 方法设置的数据
$(selector).removeData(name)//如果没有规定名称,该方法将从被选元素中删除所有已存储的数据 $("#btn2").click(function(){ $("div").removeData("greeting"); alert("Greeting is: " + $("div").data("greeting")); });//从元素中删除之前添加的数据
以上就是jquery中几种数据的实例用法汇总的详细内容,更多请关注其它相关文章!