The <data> HTML element is used to associate a machine-readable value with a piece of content, providing a way to embed custom data attributes within visible content. This element is particularly useful for applications where you need to display human-readable content while also associating it with a value that can be processed by scripts or other automated systems. The <data> tag can be used in scenarios such as tagging, data visualization, or any context where additional data needs to be stored alongside the displayed content.
The primary attribute of the <data> element is value, which holds the machine-readable value associated with the content. This attribute is essential for making the <data> element functional, as it provides the data that scripts or applications can access and manipulate. Here is an example of how the <data> tag can be used:
<p>The price of the item is <data value="19.99">$19.99</data>.</p>Valid Attributes for <data>
| Attribute | Description |
|---|---|
| value | Specifies the machine-readable value associated with the element's content. |
The <data> element supports all global attributes, allowing for additional customization and interaction through CSS and JavaScript. It is a powerful tool for embedding data within HTML documents, enabling developers to create more dynamic and data-driven web applications. By using the <data> element, developers can ensure that both human-readable and machine-readable content are seamlessly integrated.