Описание: Сохраняет произвольные данные, связанные с соответствующим элементом.
Аргументы
jQuery.data( элемент, ключ, значение )
Добавлена в версию: 1.2.3
элемент
Элемент DOM, ассоциированный с этими данными.
ключ
Строка называющая часть данных для установки.
значение
Данные
Новое значение данных.
Примечание: это метод низкого уровня; вы должны вероятно использовать вместо этого
.data().
Метод jQuery.data() позволяет нам прикрепить данные любого типа к элементам DOM безопасным способом от круговой ссылки и поэтому от утечек памяти.
Мы можем установить несколько различных значений для одного элемента и получить их позже:
jQuery.data(document.body, 'foo', 52); jQuery.data(document.body, 'bar', 'test');
Пример
Сохраняет, а затем получает значение из элемента div.Пример - Полный код:
<!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 type="text/javascript" language="javascript">
$(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>
Описание:
Возвращает значение именнованного хранилища данных для элемента, как установлено в jQuery.data (элемент, имя, значение), либо полное хранилище данных для элемента.
Аргументы
jQuery.data( элемент, ключ )
Добавлена в версию: 1.2.3
элемент
Элемент DOM для запроса данных.
ключ
Название сохраненных данных.
jQuery.data( элемент )
Добавлена в версию: 1.4
элемент
Элемент DOM для запроса данных.
Примечание: это метод низкого уровня; вы должны вероятно использовать вместо этого
.data().
Метод jQuery.data() позволяет нам прикрепить данные любого типа к элементам DOM безопасным способом от круговой ссылки и поэтому от утечек памяти.
Мы можем получить несколько различных значений каждый раз для одного элемента, или в виде набора:
alert(jQuery.data( document.body, 'foo' )); alert(jQuery.data( document.body ));
Выше дан пример предупреждения значений данных, которое созданно на элемент
body. Если ничего не было создано на тот элемент, возвращается пустая строка.
Вызов jQuery.data( элемент )
получает все соответствующие значения элемента как объект JavaScript.
Обратите внимание, что jQuery сам использует этот метод для хранения данных для внутреннего пользования, такие как обработчики событий, так что не думайте, что он содержит только данные, которые хранится в вашем собственном коде.
Пример
Получение данных, хранящихся в элементе под именем «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 type="text/javascript" language="javascript">
$(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>
Была ли эта информация полезной?
