Das data-* Attribut in HTML5 wird verwendet, um benutzerdefinierte Daten für ein HTML-Element zu speichern. Die gespeicherten Daten können privat sein oder von jedem öffentlichen Element, das die Seite, das Skript und das Stylesheet umfasst, manipuliert oder verwendet werden.
Sie können verwendet werden, um Informationen zu speichern, die nicht durch andere Attribute repräsentiert werden können. Dies ist besonders nützlich, wenn man JavaScript in einer Webseite verwendet. Mit diesem Attribut hat man eine Standardlösung, um zusätzliche Daten in das HTML einfließen zu lassen, die dann im Skript weiterverarbeitet werden können.
Das data-Attribut wird so verwendet:
```html
…
```
In diesem Beispiel gibt es ein Artikel-Element mit der ID “electric-cars”, das zusätzlich drei selbsterstellte Strukturinformationen mit sich führt: `data-columns=“3”`, `data-index-number=“12314”` und `data-parent=“cars”`.
Zur Abfrage dieser Daten, in JavaScript z.B., kann man folgenden Code verwenden:
```javascript
var article = document.getElementById(‘electric-cars’);
console.log(article.dataset.columns); // “3“
console.log(article.dataset.indexNumber); // “12314“
console.log(article.dataset.parent); // “cars“
```
Es ist zu beachten, dass der Zugriff auf das data-Attribut mithilfe des dataset-Objekts erfolgt, wobei dabei die Daten in CamelCase-Notation umgewandelt werden. Das bedeutet, dass `data-index-number` zu `dataset.indexNumber` wird.
