Attributs de données

https://developer.mozilla.org/fr/docs/Apprendre/HTML/Comment/Utiliser_attributs_donnes

Les attributs de données permettent d'ajouter des informations dans des éléments HTML. Ces informations ne sont pas visible sur le site mais peuvent être traitées en Javascript

1
2
3
4
5
6
7
<article
  id="electriccars"
  data-columns="3"
  data-indexnumber="12314"
  data-parent="cars">
...
</article>

En Javascript, on peut récupérer les informations grâce à dataset

1
2
3
4
5
6
var article = document.querySelector('#electriccars'),
data = article.dataset;
  
// data.columns -> "3"
// data.indexnumber -> "12314"
// data.parent -> "cars"

Ça devient intéressant en ajoutant un peu de PHP afin d'appeler des fonctions qui affichent des valeurs. Par exemple:

1
2
3
4
5
6
7
<article
  id="electriccars"
  data-columns="<?= getColums() ?>"
  data-indexnumber="<?= getIndex() ?>"
  data-parent="<?= getParent() ?>">
...
</article>