<data>

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since октябрь 2017 г..

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>