HTML data-* Eigenschaft

Definition und Verwendung

data-* Die Eigenschaft wird verwendet, um private benutzerdefinierte Daten der Seite oder Anwendung zu speichern.

data-* Die Eigenschaft gibt uns die Möglichkeit, benutzerdefinierte data-Attribute in alle HTML-Elemente einzubinden.

Gespeicherte (benutzerdefinierte) Daten können im JavaScript der Seite verwendet werden, um eine bessere Benutzererfahrung zu schaffen (ohne Ajax-Aufrufe oder Serverseitendatenbankabfragen).

data-* Die Eigenschaft besteht aus zwei Teilen:

  • Der Name der Eigenschaft sollte keine Großbuchstaben enthalten und nach dem Präfix "data-" muss mindestens ein Zeichen folgen
  • Der Wert kann jede beliebige Zeichenkette sein

Hinweis: Der Benutzeragent ignoriert alle durch "data-" vorgeschalteten benutzerdefinierten Attribute vollständig.

Weitere Informationen siehe:

HTML-Tutorial:HTML Eigenschaften

HTML DOM Referenzhandbuch:HTML DOM getAttribute() Methode

Beispiel

Fügen Sie benutzerdefinierte Daten ein, indem Sie die Eigenschaft data-* verwenden:

<ul>
  <li data-animal-type="鸟类">喜鹊</li>
  <li data-animal-type="鱼类">金枪鱼</li>
  <li data-animal-type="蜘蛛">Fliegenfalle</li>
</ul>

Probieren Sie es selbst aus

Syntax

<element data-*="somevalue">

Eigenschaftswert

Wert Beschreibung
somevalue Definieren Sie den Wert der Eigenschaft (als Zeichenfolge).

Browserunterstützung

Die in der Tabelle genannten Zahlen geben die erste Version des Browsers an, die diese Eigenschaft vollständig unterstützt.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 5.5 2.0 3.1 9.6