HTML
Attributs de données

Syntaxe

• <element data-custom-name="somevalue">

Paramètres

Utilisation des attributs de données

data-* attributs de data-* HTML5 data-* constituent un moyen pratique de stocker des données dans des éléments HTML. Les données stockées peuvent être lues ou modifiées en utilisant JavaScript

<div data-submitted="yes" class="user_profile">
  … some content …
</div>

• La structure de l'attribut de data-* est data-* , c'est-à-dire que le nom de l'attribut de données vient après la partie de data- . En utilisant ce nom, l'attribut est accessible.

• Les données au format chaîne (y compris json ) peuvent être stockées en utilisant l'attribut data-* .

Les anciens navigateurs prennent en charge

Les attributs de données ont été introduits dans HTML5, qui est pris en charge par tous les navigateurs modernes, mais les anciens navigateurs avant HTML5 ne reconnaissent pas les attributs de données.

Toutefois, dans les spécifications HTML, les attributs qui ne sont pas reconnus par le navigateur doivent être laissés seuls et le navigateur les ignore simplement lors du rendu de la page.

Les développeurs Web ont utilisé ce fait pour créer des attributs non standard qui sont des attributs qui ne font pas partie des spécifications HTML. Par exemple, l'attribut value dans la ligne ci-dessous est considéré comme un attribut non standard car les spécifications de la <img> n'ont pas d'attribut value et ce n'est pas un attribut global:

<img src="sample.jpg" value="test" />

Cela signifie que même si les attributs de données ne sont pas pris en charge dans les navigateurs plus anciens, ils travaillent encore et vous pouvez définir et récupérer les utiliser les mêmes génériques JavaScript setAttribute et getAttribute méthodes, mais vous ne pouvez pas utiliser le nouveau dataset de dataset propriété qui est uniquement pris en charge dans les navigateurs modernes.