Note:

Osatributos globaisdata-* formam uma classe de atributos conhecida comocustom data attributes, a qual permite que informações proprietárias sejam trocadas via script entre oHTML e sua representaçãoDOM . Todos esses dados personalizados estão disponíveis através da interfaceHTMLElement do elemento, onde o atributo está definido. A propriedadeHTMLElement.dataset concede acesso a estes atributos .O* pode ser substituído por qualquer nome, desde que sigaa regra de criação de nomes xml com as seguintes restrições:

• O nome não deve começar com xml, independente da caixa destas letras (Ex: XML, xml, XMl, XmL, ...);
• O nome não deve conter ponto e vírgula (U+003A);
• O nome não deve conter letras maiúsculas.

Observe que a propriedadeHTMLElement.dataset é umaDOMStringMap, e o nome da custom data attributedata-test-value será acessível através doHTMLElement.dataset.testValue ( ouHTMLElement.dataset["testValue"] ) e todo o traço (U+002D) será substituído pela capitalização(tornar maiúscula) da letra subsequente, deixando o nome no formato camelcase.

Uso

Para adicionar atributosdata-* , mesmo os elementos HTML mais comuns podem tornar-se mais complexos e poderosos objetos programáveis. Por exemplo, um "sprite" de uma nave espacial em um jogo pode ser um simples elemento<img> com um atributoclass e diversos atributos data-*:

<img src="shipX3.png"  data-navio-id="324"   data-armas="laserI laserII"   data-escudos="72%"  data-x="414354" data-y="85160" data-z="31940" </img>

(Veja maisaqui)

Especificações

Compatibilidade com navegadores

See also

• Allglobal attributes.
• TheHTMLElement.dataset property that allows to access and modify these values.