HTML
Атрибуты данных
Поиск…
Синтаксис
<element data-custom-name="somevalue">
параметры
Значение | Описание |
---|---|
SomeValue | Задает значение атрибута (в виде строки) |
Использование атрибута данных
HTML5 data-*
атрибуты обеспечивают удобный способ для хранения данных в HTML - элементах. Сохраненные данные могут быть прочитаны или изменены с помощью JavaScript
<div data-submitted="yes" class="user_profile">
… some content …
</div>
Структура атрибута
data-*
-data-*
, т.е. имя атрибута data появляется после частиdata-
. Используя это имя, можно получить доступ к атрибуту.Данные в формате строки (включая
json
) могут быть сохранены с использованием атрибутаdata-*
.
Поддержка старых браузеров
Атрибуты данных были введены в HTML5, который поддерживается всеми современными браузерами, но старые браузеры до того, как HTML5 не распознают атрибуты данных.
Однако в спецификациях HTML атрибуты, которые не распознаются браузером, должны быть оставлены в покое, и браузер просто игнорирует их при рендеринге страницы.
Веб-разработчики использовали этот факт для создания нестандартных атрибутов, которые являются атрибутами, не входящими в спецификации HTML. Например, атрибут value
в строке ниже считается нестандартным атрибутом, поскольку спецификации <img>
не имеют атрибута value
и не являются глобальным атрибутом:
<img src="sample.jpg" value="test" />
Это означает, что, хотя атрибуты данных не поддерживаются в старых браузерах, они все еще работают, и вы можете устанавливать и извлекать их с использованием тех же общих setAttribute
getAttribute
JavaScript и getAttribute
, но вы не можете использовать новое свойство dataset
которое поддерживается только в современных браузерах.