Het data-attribuut in HTML5 wordt gebruikt om extra informatie op te slaan die niet zichtbaar is voor de gebruiker maar kan worden gebruikt door Javascript. Het attribuut bestaat uit twee delen:
1. Het woord ‘data-’ zelf.
2. Een woord of woorden na ‘data-’ (bijv. ‘data-name’, ‘data-id’, ‘data-info’) die de informatie aangeven die is opgeslagen in het data-attribuut.
Hier zijn enkele redenen waarom je het data-attribuut in HTML5 zou gebruiken:
1. Om informatie op te slaan die later kan worden opgehaald met Javascript.
2. Om gegevens op te slaan op een element-by-element basis, in plaats van op een globaal niveau.
3. Om gestandaardiseerde gegevens in html op te slaan die niet worden ondersteund door bestaande attributen.
Hier is hoe je het data-attribuut kunt gebruiken:
```
Later kun je deze data-attributen in Javascript op de volgende manier ophalen:
```
var myDiv = document.getElementById(‘example’);
var name = myDiv.dataset.name; // returns “test“
var id = myDiv.dataset.id; // returns “123“
var info = myDiv.dataset.info; // returns “extra informatie“
```
In dit voorbeeld worden ‘name’, ‘id’ en ‘info’ opgeslagen als data attributen op het div-element. Deze waarden zijn later toegankelijk met JavaScript door de dataset eigenschap te gebruiken.
