HTML Атрибут data-*
Пример
Используйте атрибут data - * для внедрения пользовательских данных:
<ul>
<li data-animal-type="bird">Сова</li>
<li data-animal-type="fish">Лосось</li>
<li data-animal-type="spider">Тарантул</li>
</ul>
Попробуйте сами »
Определение и использование
Атрибуты data-* используются для хранения личных данных пользователя на странице или в приложении.
Атрибуты data-* дают нам возможность встраивать пользовательские атрибуты данных во все элементы HTML.
Затем сохраненные (пользовательские) данные можно использовать в JavaScript страницы для создания более привлекательного пользовательского интерфейса (без каких-либо вызовов Ajax или запросов к базе данных на стороне сервера).
Атрибуты data-* состоят из двух частей:
- Атрибут name не должн содержать заглавные буквы и должен содержать хотя бы один символ после префикса "data-"
- Значением атрибута может быть любая строка
Примечание: Пользовательские атрибуты с префиксом "data-" будет полностью проигнорирован агентом пользователя.
Поддержка браузеров
Числа в таблице указывают первую версию браузера, которая полностью поддерживает атрибут.
| Атрибут | |||||
|---|---|---|---|---|---|
| data-* | 4.0 | 5.5 | 2.0 | 3.1 | 9.6 |
Различий между HTML 4.01 и HTML5
Атрибуты data-* является новым в HTML5.
Синтаксис
<element data-*="somevalue">
Значение атрибута
| Value | Описание |
|---|---|
| somevalue | Задает значение атрибута (в виде строки) |
Связанные страницы
Учебник HTML: Атрибуты HTML
Справочник DOM HTML: Метод getAttribute() DOM HTML
