Я не нашел, что такое использование данных функции jquery data()
. Кто-нибудь может дать мне пример того, как его можно использовать?
Что делает функция jQuery data()
Ответ 1
Он действительно полезен для связывания различных объектов, строк, массивов и т.д. с элементом DOM. Вот забавное гипотетическое использование:
$(document).ready(function(){
$("a").each(function(index, el){
if(index % 2 == 0)
$(this).data('coolColor', 'Orange'); // Set the data
else
$(this).data('coolColor', 'Purple'); // Set the data
}).click(function(e){
alert($(this).data('coolColor')); // Retrieve the data
e.preventDefault();
});
});
Это будет выбирать каждый тэг a
и установить Orange
, если его нечетный или Purple
, если он четный. Это не самый оптимальный способ написать этот код, если это то, что вы действительно хотели сделать, но иллюстрирует, как использовать функцию .data()
.
Вы также можете использовать его для хранения объектов:
$("#header").data('headerSettings',{
color: "red",
cost: "$25.00",
time: 1000
});
Теперь вы можете получить доступ к этим данным в другом месте на странице:
$("#header").data('headerSettings').color;
Ответ 2
Я думаю, что этот вопрос требует немного больше внимания. jQuery data
API действительно эффективен для различных случаев использования.
Функция данных jQuery позволяет хранить и извлекать любые связанные данные с любым объектом jQuery.
В первую очередь, его также можно использовать для чтения атрибутов data-
, установленных на любом node в html.
Пример 1
HTML:
<div id="myNode" data-foo="bar"></div>
.
Код jQuery:
$("#myNode").data("foo") //bar
Пример 2
Аналогично, я могу сохранить значение w.r.t в любом node.
Код jQuery:
$("#myNode").data("foo","baz")
$("#myNode").data("foo") //baz
Важно отметить, что когда вы устанавливаете данные в заметке с использованием API данных, html не обновляется в DOM. Если вы хотите обновить HTML, вы можете придерживаться метода attr("data-foo","baz")
.
Пока можно считывать строки, хранящиеся в атрибутах данных HTML, вы также можете назначать объект при сохранении значения с использованием API данных.
Существуют различные варианты использования, при которых разработчики связывают объект с node.
например.
var obj = {
name : "test"
}
$("#myNode").data("foo",obj);
$("#myNode").data("foo") === obj //true
Вперед, исследовать здесь API.
Ответ 3
Он позволяет связывать любые типы данных с элементом DOM. См. этот блог для некоторых примеров.
Ответ 4
документация jQuery подводит итог:
Возвращает уникальный идентификатор элемента.
Обычно эта функция будет только используется внутри. Вы, скорее всего, не используйте метод data() таким образом.автоматически вызывается при необходимости при использовании других данных() функциональность.
В основном эта функция существует для поддержки других функций jQuery. Лучше всего игнорировать эту функцию, поскольку она не предназначена для частичного публичного интерфейса API jQuery.