Атрибуты данных позволяют создавать пользовательские атрибуты для хранения произвольной информации. Данные могут быть получены с помощью скриптов . Имя атрибута должно обязательно начинаться с data-, дальше можно использовать латинские буквы в нижнем регистре, цифры и следующие символы: дефис (-), двоеточие (:), подчёркивание (_).
Вообще можно создавать любые нестандартные атрибуты, обратиться к которым можно с помощью методов JavaScript setAttribute и getAttribute, однако таким образом нельзя обратится к атрибуту через свойство элемента. Поэтому в HTML5 была добавлена возможность использования пользовательских атрибутов посредством глобального атрибута data-*, доступ к которому можно осуществить через свойство элемента dataset.
Пользовательские атрибуты data-* предназначены для хранения пользовательских данных, состояний, аннотаций и т.д., для которых нет более подходящих атрибутов или элементов.
<element data-* = "value">Например,
<span data-mytrans-en="Contacts">Контакты</span>В коде JavaScript можно получить значение этого атрибута или задать:
значение = элемент.dataset.атрибут;
элемент.dataset.атрибут = значение;Например в нашем случае:
val = el.dataset.mytransEn;
el.dataset.mytransEn = val;Имена атрибутов преобразуются в свойство по определенным правилам:
data- заменяется на dataset.;data-has-payment-request преобразуется в переменную dataset.hasPaymentRequest. Обратите внимание, что первая буква ('h') после data- остается в нижнем регистре.| Базовая поддержка | 7 | 12 | 6 | 11 | 11.5 | 5.1 |
|---|
| Базовая поддержка | 3 | 70 | да | да | 12 | 5 | да |
|---|