<data>: Das Data-Element

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017.

Das <data>HTML-Element verbindet ein gegebenes Inhaltselement mit einer maschinenlesbaren Übersetzung. Wenn der Inhalt zeit- oder datumsbezogen ist, muss das <time>-Element verwendet werden.

Probieren Sie es aus

<p>New Products:</p> <ul> <li><data value="398">Mini Ketchup</data></li> <li><data value="399">Jumbo Ketchup</data></li> <li><data value="400">Mega Jumbo Ketchup</data></li> </ul>

data:hover::after { content: " (ID " attr(value) ")"; font-size: 0.7em; }

Attribute

Die Attribute dieses Elements umfassen die globalen Attribute.

value: Dieses Attribut gibt die maschinenlesbare Übersetzung des Inhalts des Elements an.

Beispiele

Das folgende Beispiel zeigt Produktnamen an, verknüpft jedoch jeden Namen mit einer Produktnummer.

html

<p>New Products</p> <ul> <li><data value="398">Mini Ketchup</data></li> <li><data value="399">Jumbo Ketchup</data></li> <li><data value="400">Mega Jumbo Ketchup</data></li> </ul>

Ergebnis

Technische Zusammenfassung

Inhaltskategorien	Flussinhalt, Phrasierungsinhalt, fühlbarer Inhalt.
Erlaubter Inhalt	Phrasierungsinhalt.
Tag-Auslassung	Keine, sowohl das Start- als auch das End-Tag sind obligatorisch.
Erlaubte Eltern	Jedes Element, das Phrasierungsinhalt akzeptiert.
Implizierte ARIA-Rolle	`generic`
Erlaubte ARIA-Rollen	Beliebige
DOM-Schnittstelle	[`HTMLDataElement`](/de/docs/Web/API/HTMLDataElement)

Spezifikationen

Specification
HTML # the-data-element

Browser-Kompatibilität

Siehe auch

Das HTML-Element <time>.