Definition und Verwendung
Die data-* Attribute wird verwendet , um benutzerdefinierte Daten zu speichern , privat auf die Seite oder Anwendung.
Die data-* Attribute gibt uns die Möglichkeit , benutzerdefinierte Datenattribute auf alle HTML - Elemente einbinden.
Die gespeicherte (custom) Daten können dann in der JavaScript-Seite verwendet werden, ein ansprechender Benutzererfahrung zu schaffen (ohne Ajax-Aufrufe oder serverseitige Datenbankabfragen).
Die data-* Attribute bestehen aus zwei Teilen:
- Der Attributname darf keine Großbuchstaben verwenden , und muss mindestens ein Zeichen lang sein , nachdem das Präfix "data-"
- Der Attributwert kann eine beliebige Zeichenfolge sein
Hinweis: Benutzerdefinierte Attribute mit dem Präfix "data-" wird vollständig durch den User - Agent ignoriert werden.
Gilt für
Das contextmenu Attribut ist Teil der globalen Attribute und kann auf jedem beliebigen HTML - Element verwendet werden.
| Element | Attribut |
|---|---|
| Alle HTML-Elemente | data-* |
Beispiel
Beispiel
Verwenden Sie die data-* Attribut benutzerdefinierte Daten einzubetten:
<ul>
<li data-animal-type="bird">Owl</li>
<li
data-animal-type="fish">Salmon</li>
<li
data-animal-type="spider">Tarantula</li>
</ul>
Versuch es selber " Browser-Unterstützung
Die Zahlen in der Tabelle geben Sie die erste Browser-Version, die das Attribut vollständig unterstützt.
| Attribut | |||||
|---|---|---|---|---|---|
| data-* | 4.0 | 5.5 | 2.0 | 3.1 | 9.6 |