jQuery: Data vs Attr - В чем разница?
В чем разница между использованием $.data
и $.attr
при работе с data-someAttribute
?
Насколько я понимаю, $.data
сохраняет данные в кэше jQuery, а не в DOM. Поэтому, если я хочу использовать кэш jQuery для хранения данных, мне следует использовать $.data
. Если же я хочу добавить HTML5-атрибуты data-, мне следует использовать $.attr("data-attribute", "myCoolValue")
.
1 ответ(ов)
Вы можете использовать атрибут data-*
для встраивания пользовательских данных. Атрибуты data-*
предоставляют возможность добавлять собственные атрибуты данных ко всем HTML-элементам.
Метод jQuery .data()
позволяет получать и устанавливать данные любого типа для DOM-элементов безопасным способом, который исключает возможность циклических ссылок и, следовательно, утечек памяти.
С другой стороны, метод jQuery .attr()
получает/устанавливает значение атрибута только для первого элемента в наборе совпадений.
Пример:
<span id="test" title="foo" data-kind="primary">foo</span>
$("#test").attr("title"); // Получаем значение атрибута title
$("#test").attr("data-kind"); // Получаем значение атрибута data-kind
$("#test").data("kind"); // Получаем значение, сохраненное с помощью метода data
$("#test").data("value", "bar"); // Устанавливаем новое значение для data-атрибута
Таким образом, рекомендуется использовать метод .data()
для работы с пользовательскими данными, а метод .attr()
— для работы с обычными атрибутами, чтобы избежать возможных проблем с производительностью и памятью.
Как узнать, какая радиокнопка выбрана с помощью jQuery?
Эквивалент jQuery $.ready() на чистом JavaScript - как вызвать функцию, когда страница/DOM готовы (дубликат)
Потеряно HTML-кодирование при чтении атрибута из поля ввода
Высота, равная динамической ширине (флюидная верстка на CSS)
jQuery/JavaScript: Замена битых изображений