Атрибут data-* HTML

Определение и использование

data-* Атрибут предназначен для хранения私有ных пользовательских данных страницы или приложения.

data-* Атрибут предоставляет нам возможность внедрять пользовательские данные data в все элементы HTML.

Сохранившиеся (пользовательские) данные могут быть использованы в JavaScript страницы, чтобы создать лучший пользовательский опыт (без вызовов Ajax или запросов к серверной базе данных).

data-* Атрибут состоит из двух частей:

  • Имя свойства не должно содержать больших букв и должно начинаться с至少 одного символа после префикса "data-"
  • Значение属性 может быть любой строкой

Указатель пользователя полностью игнорирует пользовательские атрибуты с префиксом "data-".

См. также:

Уроки HTMLHTML свойства

Руководство по DOM HTMLМетод getAttribute() DOM HTML

Пример

Использование свойств data-* для внедрения пользовательских данных:

<ul>
  <li data-animal-type="птицы">Синица</li>
  <li data-animal-type="рыбы">Тунец</li>
  <li data-animal-type="пчела">Паук</li>
</ul>

Попробуйте сами

Синтаксис

<element data-*="somevalue">

Значение свойства

Значение Описание
somevalue Определяет значение свойства (в виде строки).

Поддержка браузерами

Числа в таблице указывают на версию первого браузера, который полностью поддерживает это свойство.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 5.5 2.0 3.1 9.6