Jquery核心(三) Data

jQuery数据

[1] data( name )      Returns: Any
      name ：  String 存储的数据的标识。
      说明：  返回data(name, value)设置的名为name的数据。如果一个jQuery集合中有多个元素，则返回第一个元素的值。该方法用于避免循环引用的风险地获取存储的数据。
     

$("button").click(function(e) {
      var value;

      switch ($("button").index(this)) {
        case 0 :
          value = $("div").data("blah");
          break;
        case 1 :
          $("div").data("blah", "hello");
          value = "Stored!";
          break;
        case 2 :
          $("div").data("blah", 86);
          value = "Stored!";
          break;
        case 3 :
          $("div").removeData("blah");
          value = "Removed!";
          break;
      }

      $("span").text("" + value);
    });

$("button").click(function(e) {
      var value;

      switch ($("button").index(this)) {
        case 0 :
          value = $("div").data("blah");
          break;
        case 1 :
          $("div").data("blah", "hello");
          value = "Stored!";
          break;
        case 2 :
          $("div").data("blah", 86);
          value = "Stored!";
          break;
        case 3 :
          $("div").removeData("blah");
          value = "Removed!";
          break;
      }

      $("span").text("" + value);
    });

[2] data( name, value )      Returns: jQuery
      name ：  String 存储的数据的标识。
      value：   Any 存储的数据。 
      说明：  设置数据。
     

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

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

[3] removeData( name )       Returns: jQuery
      name ：  String 存储的数据的标识。
      说明：  移除数据。
     

$("div").data("test1", "VALUE-1");
$("div").removeData("test1");

 $("div").data("test1", "VALUE-1");
 $("div").removeData("test1");

[4] queue( [name] )        Returns: Array<Function>
      name ：  String 队列的标识(默认为fx)。
      说明：  返回第一个匹配元素的队列（为一个函数数组an array of functions）。
     

$("#show").click(function () {
    var n = $("div").queue("fx");
    $("span").text("Queue length is: " + n.length);
  });
  function runIt() {
    $("div").show("slow");
    $("div").animate({left:'+=200'},2000);
    $("div").slideToggle(1000);
    $("div").slideToggle("fast");
    $("div").animate({left:'-=200'},1500);
    $("div").hide("slow");
    $("div").show(1200);
    $("div").slideUp("normal", runIt);
  }
  runIt();

  $("#show").click(function () {
      var n = $("div").queue("fx");
      $("span").text("Queue length is: " + n.length);
    });
    function runIt() {
      $("div").show("slow");
      $("div").animate({left:'+=200'},2000);
      $("div").slideToggle(1000);
      $("div").slideToggle("fast");
      $("div").animate({left:'-=200'},1500);
      $("div").hide("slow");
      $("div").show(1200);
      $("div").slideUp("normal", runIt);
    }
    runIt();

[5] queue( [name], callback )        Returns: jQuery
      name ：  String 存储的数据的标识(默认为fx)。
      callback ：  Function 增加到队列的函数。
      说明：  在所有匹配元素的队列尾部添加一个函数并立即执行。
     

$(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();
   });

 $(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();
    });

[6] queue( [name], queue )        Returns: jQuery
      name ：  String 存储的数据的标识(默认为fx)。
      queue ：  Array<Function>替换原队列的队列。
      说明：  用一个新队列替换匹配的元素的队列。


[7] dequeue( [name] )        Returns: jQuery
      name ：  String 存储的数据的标识(默认为fx)。
      说明：  将队首函数出队，并执行。