What are data-* attributes used for?
The Purpose of data-* Attributes in HTML
data-* attributes in HTML are custom attributes that let you store extra information (metadata) on standard HTML elements. They are not displayed to the user, but can be easily accessed in JavaScript using the dataset property. This makes them useful for attaching extra data to elements without cluttering the DOM with hidden elements or non-standard attributes.
Example of Using data-* Attributes
Key Points About data-* Attributes
data-*lets you create custom attributes on HTML elements.They must begin with
data-followed by a name (e.g.,data-user-id).JavaScript can access them via
element.dataset(e.g.,element.dataset.userId).Useful for passing configuration, IDs, or small bits of data to scripts.