Explications
Les attributs data-*, contrairement aux microformats et microdatas, sont destinés à un usage privé au sein d'une page ou d'une application. Ces données sont modifiables grâce à du Javascript.
Ces attributs doivent respecter les règles suivantes :
Le nom de l'attribut ne doit pas contenir de lettres majuscules et avoir une longueur minimum de un caractère avec le préfixe "data-"
L'attribut peut être n'importe quelle chaîne de caractère
Exemple :
1
<ul>
2
<li onclick="showDetails(this)" id="owl" data-animal-type="bird">Owl</li>
3
<li onclick="showDetails(this)" id="salmon" data-animal-type="fish">Salmon</li>
4
<li onclick="showDetails(this)" id="tarantula" data-animal-type="spider">Tarantula</li>
5
</ul>
1
function showDetails(animal) {
2
var animalType = animal.getAttribute("data-animal-type");
3
alert("The " + animal.innerHTML + " is a " + animalType + ".");
4
}