The dataset
read-only property of the HTMLElement
interface provides read/write access to custom data attributes (data-*
) on elements. It exposes a map of strings (DOMStringMap
) with an entry for each data-*
attribute.
Note: The dataset
property itself can be read, but not directly written. Instead, all writes must be to the individual properties within the dataset
, which in turn represent the data attributes.
An HTML data-*
attribute and its corresponding DOM dataset.property
modify their shared name according to where they are read or written:
- In HTML
-
The attribute name begins with
data-
. It can contain only letters, numbers, dashes (-
), periods (.
), colons (:
), and underscores (_
). Any ASCII capital letters (A
toZ
) are converted to lowercase. - In JavaScript
-
The property name of a custom data attribute is the same as the HTML attribute without the
data-
prefix, and removes single dashes (-
) for when to capitalize the property's "camel-cased" name.
In addition to the information below, you'll find a how-to guide for using HTML data attributes in our article Using data attributes.