index.md

---

title: '<data>: The Data element'
slug: Web/HTML/Element/data
page-type: html-element
browser-compat: html.elements.data

---

{{HTMLSidebar}}

The <data> HTML element links a given piece of content with a machine-readable translation. If the content is time- or date-related, the {{HTMLElement("time")}} element must be used.

{{EmbedInteractiveExample("pages/tabbed/data.html", "tabbed-shorter")}}

Content categories	Flow content, phrasing content, palpable content.
Permitted content	Phrasing content.
Tag omission	{{no_tag_omission}}
Permitted parents	Any element that accepts phrasing content.
Implicit ARIA role	No corresponding role
Permitted ARIA roles	Any
DOM interface	{{domxref("HTMLDataElement")}}

Attributes

This element's attributes include the global attributes.

• value

  • : This attribute specifies the machine-readable translation of the content of the element.

Examples

The following example displays product names but also associates each name with a product number.

<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>

Result

{{EmbedLiveSample('Examples')}}

Specifications

{{Specifications}}

Browser compatibility

{{Compat}}

See also

• The HTML {{HTMLElement("time")}} element.