data

« Обратно на страницу Ядро jQuery


data( имя )

Возвращает данные, которые хранятся в элементе под определенным именем. Если jQuery-коллекция ссылается на несколько элементов, то возвращаемое значение будет указывать на первый элемент. Эта функция используется для получения данных, хранящихся в элементе без риска циклической зависимости. Функция использует jQuery.data и является нововведением для версии 1.2.3. Область применения этой функции очень широка и, например, jQuery UI пользуется ею достаточно часто.

Аргументы:

имя Строка

Имя элемента в котором хранятся данные.

Примеры:

Получение данных, хранящихся в элементе под именем «blah».

    $("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);
    });
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>

  <script>
  $(document).ready(function(){

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

  });
  </script>

  <style>
  div { margin:5px; background:yellow; }
  button { margin:5px; font-size:14px; }
  p { margin:5px; color:blue; }
  span { color:red; }
  </style>
</head>
<body>
  <div>A div</div>
  <button>Get "blah" from the div</button>

  <button>Set "blah" to "hello"</button>
  <button>Set "blah" to 86</button>

  <button>Remove "blah" from the div</button>
  <p>The "blah" value of this div is <span>?</span></p>

</body>
</html>
Name Type

data( имя, значение )

Сохраняет данные в элементе под определенным именем. Если jQuery-коллекция ссылается на несколько элементов, то данные будут сохраняться в каждом из них. Значение данных, являющееся объектом JavaScript, не копируется и будет разделено между всеми элементами в коллекции.

Функция может быть полезна для присоединения данных к элементу без необходимости создания нового объекта. Строка не ограничена и может иметь любой формат данных.

Также функция может быть использована для получения событий прикрепленных к элементам, однако эта особенность пока не поддерживается. Первым параметром предполагается элемент, вторым – строка «события».

Аргументы:

имя Строка

Имя элемента в котором надо сохранить данные

значение Данные
Значение.
Примеры:

Сохраняет, а затем получает значение из элемента div.

    $("div").data("test", { first: 16, last: "pizza!" });
    $("span:first").text($("div").data("test").first);
    $("span:last").text($("div").data("test").last);
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>

  <script>
  $(document).ready(function(){

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

  });
  </script>

  <style>
  div { color:blue; }
  span { color:red; }
  </style>
</head>
<body>
  <div>
    The values stored were
    <span></span>

    and
    <span></span>
  </div>
</body>
</html>
Name Type