<data>

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017.

We’d love to hear your thoughts on the next set of proposals for the JavaScript language. You can find a description of the proposals here.
Please take two minutes to fill out our short survey.

HTML-элемент <data> связывает данное содержимое с машиночитаемым представлением. Если содержимое относится к времени или дате, необходимо использовать элемент <time>.

Интерактивный пример

<p>New Products:</p>
<ul>
  <li><data value="398">Mini Ketchup</data></li>
  <li><data value="399">Jumbo Ketchup</data></li>
  <li><data value="400">Mega Jumbo Ketchup</data></li>
</ul>

data:hover::after {
  content: " (ID " attr(value) ")";
  font-size: 0.7em;
}
Категории контента Потоковый контент, фразовый контент, явный контент.
Разрешённое содержимое Фразовый контент.
Пропуск тегов Нет, открывающий и закрывающий теги обязательны.
Разрешённые родители Любой элемент который принимает фразовый контент.
DOM-интерфейс HTMLDataElement

Атрибуты

Этот элемент включает глобальные атрибуты.

value

Этот атрибут определяет машиночитаемый перевод содержимого элемента.

Пример

Следующий пример отображает названия продуктов, а также связывает каждое имя с номером продукта.

html
<p>New Products</p>
<ul>
  <li><data value="398">Mini Ketchup</data></li>
  <li><data value="399">Jumbo Ketchup</data></li>
  <li><data value="400">Mega Jumbo Ketchup</data></li>
</ul>

Спецификации

Specification
HTML
# the-data-element

Совместимость с браузерами

Смотрите также