HTML data Tag

The HTML <data> tag serves the purpose of offering a machine-readable rendition of its content. This tag showcases the information in a distinct manner. It proves beneficial when there is a requirement for the data to adhere to a specific format for scripting purposes, even if this differs from the preferred user-facing format.

Let's take a scenario to understand it well:

Suppose you need to display numerical values to users using words like "one," "two," "three," etc., but your script requires the numbers to be sorted in either ascending or descending order. In this case, you will need the numbers in a format such as 1, 2, 3, and so forth.

The <data> element is available to address your issue.

For individuals: Compose content enclosed by the <data>....</data> tag.

For the script: Use value attribute.

<data value="1">One </data>

HTML data tag attribute

There is a single mandatory attribute. The data tag also accepts global and event attributes.

HTML data tag example

<ul>

<li><data value="101">C# Tutorial</data></li>

<li><data value="111">SQL tutorial</data></li>

<li><data value="121">HTML tutorial</data></li>

</ul>

Output:

• ✅ C# Tutorial
• ✅ SQL tutorial
• ✅ HTML tutorial

Supporting Browsers