L’élément “data” en HTML5 permet de représenter une paire de clé-valeur en tant qu’attribut d’un élément HTML. Ces “données personnalisées” sont préservées, même si vous modifiez le reste de l’élément HTML.
Voici une brève explication de la façon dont vous pouvez l’utiliser dans votre code HTML:
1. Ajoutez l’attribut `data-*` à un élément HTML, où `*` est le nom que vous donnez à vos données. Par exemple :
```
My Custom Data
1. Vous pouvez ensuite utiliser JavaScript pour accéder à cette donnée personnalisée comme suit:
```
let myDataElement = document.querySelector(‘p’);
let myDataValue = myDataElement.dataset.mydata; // “123“
```
Note : `mydata` dans `dataset.mydata` doit être en camelCase si le nom de l’attribut data contient un tiret. Par exemple, `data-my-data` devient `dataset.myData`.
Une chose à noter est que toutes les données stockées en utilisant l’attribut `data-*` sont stockées en tant que chaînes de caractères. Ainsi, si vous stockez des données numériques, vous devrez les convertir en chiffres avant de les utiliser dans un contexte numérique.
Les attributs de données sont très utiles lorsque vous avez besoin de stocker des informations supplémentaires qui ne sont pas directement affichées à l’utilisateur, mais qui peuvent être utilisées par votre code JavaScript.