<data> : l'élément de données

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017.

We’d love to hear your thoughts on the next set of proposals for the JavaScript language. You can find a description of the proposals here.
Please take two minutes to fill out our short survey.

L'élément HTML <data> relie un contenu à une version de ce contenu interprétable par un ordinateur. Si le contenu possède une composante temporelle, l'élément <time> doit être utilisé.

Exemple interactif

<p>New Products:</p>
<ul>
  <li><data value="398">Mini Ketchup</data></li>
  <li><data value="399">Jumbo Ketchup</data></li>
  <li><data value="400">Mega Jumbo Ketchup</data></li>
</ul>

data:hover::after {
  content: " (ID " attr(value) ")";
  font-size: 0.7em;
}
Catégories de contenu Contenu de flux, contenu phrasé, contenu tangible.
Contenu autorisé Contenu phrasé.
Omission de balises Aucune, la balise d'ouverture et la balise de fermeture sont obligatoires.
Éléments parents autorisés Tout élément acceptant du contenu phrasé.
Rôle ARIA implicite Pas de rôle correspondant
Rôles ARIA autorisés Tous les rôles.
Interface DOM HTMLDataElement

Attributs

Comme pour tous les autres éléments, on peut utiliser les attributs universels sur <data>.

value

Cet attribut définit la version du contenu qui doit être interprétée par une machine.

Exemples

Dans l'exemple suivant, on affiche des noms de produits avec des codes correspondants :

html
<p>Nouveaux produits</p>
<ul>
  <li><data value="3251546">Mini voiture</data></li>
  <li><data value="5867654">Grande voiture</data></li>
  <li><data value="9887635">Énorme voiture</data></li>
</ul>

Résultat

Spécifications

Specification
HTML
# the-data-element

Compatibilité des navigateurs

Voir aussi