Jquery基礎學習

1. 數據存儲

data([name]):返回元素上储存的相应名字的数据,可以用data(name, value)来设定

如果jQuery集合指向多个元素,那将只返回第一个元素的对应数据

$("div").data("blah");  // undefined
$("div").data("blah", "hello");  // blah设置为hello
$("div").data("blah");  // hello
$("div").data("blah", 86);  // 设置为86
$("div").data("blah");  //  86
$("div").removeData("blah");  //移除blah
$("div").data("blah");  // undefined

存取名/值对数据

$("div").data("test", { first: 16, last: "pizza!" });
$("div").data("test").first  //16;
$("div").data("test").last  //pizza!;

2. 隊列

queue(name, callback) :在匹配的元素的队列最后添加一个函数

name:隊列名,默認 fx ; callback: 要添加进队列的函数

$(document.body).click(function () {
      $("div").show("slow");
      $("div").animate({left:'+=200'},2000);
      $("div").queue(function () {
          $(this).addClass("newcolor");
          $(this).dequeue();
      });
      $("div").animate({left:'-=200'},500);
      $("div").queue(function () {
          $(this).removeClass("newcolor");
          $(this).dequeue();
      });
      $("div").slideUp();
});

queue(name, queue) :将匹配元素的队列用新的一个队列来代替(函数数组).

name:隊列名,默認 fx ; queue:Array<Function> 函數數組

 $("#stop").click(function () {
      $("div").queue("fx", []);
      $("div").stop();
  });

queue(name): 返回指向第一个匹配元素的队列(将是一个函数数组)

$("#show").click(function () {
      var n = $("div").queue("fx");
      $("span").text("Queue length is: " + n.length);
});

dequeue(name): 从队列最前端移除一个队列函数,并执行他

$("button").click(function () {
      $("div").animate({left:'+=200px'}, 2000);
      $("div").animate({top:'0px'}, 600);
      $("div").queue(function () {
          $(this).toggleClass("red");
          $(this).dequeue();//用dequeue来结束自定义队列函数,并让队列继续进行下去       
    }); $(
"div").animate({left:'10px', top:'30px'}, 700); });

clearQueue([queueName]): 清空对象上尚未执行的所有队列

如果不带参数,则默认清空的是动画队列。这跟stop(true)类似,但stop()只能清空动画队列,而这个可以清空所有通过 .queue() 创建的队列

posted @ 2013-04-16 21:30  邪见  阅读(126)  评论(0)    收藏  举报