Diese Übersetzung ist unvollständig. Bitte helfen Sie uns, diesen Artikel aus dem Englischen zu übersetzen

The data-* global attributes form a class of attributes called custom data attributes, that allow proprietary information to be exchanged between the HTML and its DOM representation by scripts.

All such custom data are available via the HTMLElement interface of the element the attribute is set on. The HTMLElement.dataset property gives access to them.
The * may be replaced by any name following the production rule of xml names with the following restrictions:

  • the name must not start with xml, whatever case is used for these letters;
  • the name must not contain any semicolon (U+003A);
  • the name must not contain capital letters.

Note that the HTMLElement.dataset property is a DOMStringMap, and the name of the custom data attribute data-test-value will be accessible via HTMLElement.dataset.testValue ( or HTMLElement.dataset["testValue"] ) as any dash (U+002D) is replaced by the capitalization of the next letter, converting the name to camelcase.


By adding data-* attributes, even ordinary HTML elements can become rather complex and powerful program-objects.  For example, a space-ship "sprite" in a game could be a simple <img> element with a class attribute and several data-* attributes:

<img class="spaceship cruiserX3" src="shipX3.png"
  data-ship-id="324" data-weapons="laserI laserII" data-shields="72%"
  data-x="414354" data-y="85160" data-z="31940"

For a more in-depth tutorial about using HTML data attributes, see Using data attributes.


Specification Status Comment
HTML Living Standard
Die Definition von 'data-*' in dieser Spezifikation.
Lebender Standard No change from latest snapshot, HTML 5.1
HTML 5.1
Die Definition von 'data-*' in dieser Spezifikation.
Empfehlung Snapshot of HTML Living Standard, no change from HTML5
Die Definition von 'data-*' in dieser Spezifikation.
Empfehlung Snapshot of HTML Living Standard, initial definition.

Browser compatibility

Update compatibility data on GitHub
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidFirefox für AndroidOpera für AndroidSafari auf iOSSamsung Internet
data-* attributesChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung JaIE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung JaOpera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja


Vollständige Unterstützung  
Vollständige Unterstützung

See also