<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 ⁨Oktober 2017⁩.

Das <data> HTML-Element verknüpft ein gegebenes Stück Inhalt 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, verknüpft jedoch auch 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 Übersicht

Inhaltskategorien	Fließender Inhalt, formulierungsmäßiger Inhalt, fühlbarer Inhalt.
Erlaubter Inhalt	Formulierungsmäßiger Inhalt.
Tag-Auslassung	Keine, sowohl der Anfangs- als auch der End-Tag sind obligatorisch.
Erlaubte Eltern	Jedes Element, das formulierungsmäßigen Inhalt akzeptiert.
Implizite ARIA-Rolle	`generisch`
Erlaubte ARIA-Rollen	Beliebig
DOM-Schnittstelle	[`HTMLDataElement`](/de/docs/Web/API/HTMLDataElement)

Spezifikationen

Specification
HTML # the-data-element

Browser-Kompatibilität

Siehe auch

Das HTML-<time>-Element.

Help improve MDN

Learn how to contribute Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden