MDN wants to talk to developers like you: https://qsurvey.mozilla.com/s3/8d22564490d8

data-*

This translation is incomplete. Please help translate this article from English.

Els atributs globals data-* formen una classe d'atributs anomenats atributs de dades personalitzades, que permeten que la informació propietària s'intercanviï entre l' HTML i la seva representació DOM mitjançan scripts. Totes aquestes dades personalitzades estan disponibles a través de la interfície HTMLElement de l'element en el qual s'estableix l'atribut. La propietat HTMLElement.dataset li dóna accés. El * pot ser reemplaçat per qualsevol nom que segueix la regla de producció de noms XML amb les següents restriccions:

  • el nom no ha de començar amb xml, qualsevol que sigui el cas que s'utilitzi per a aquestes lletres;
  • el nom no ha de contenir cap punt i coma (U+003A);
  • el nom no ha de contenir majúscules de l'A a la Z.

Recordeu que la propietat HTMLElement.dataset és un DOMStringMap, i el nom de l'atribut de dades personalitzades data-test-value serà accessible a través de HTMLElement.dataset.testValue ( o HTMLElement.dataset["testValue"] ) com qualsevol guió (u+002D) se substitueix la següent lletra en majúscula, convertint el nom a (CamelCase).

Ùs

Mitjançant la incorpoarció d'atributs data-*, fins i tot els elements HTML ordinaris poden convertir-se en programes-objectes força complexos i potents. Per exemple, una nau espacial "sprite" en un joc podria ser un simple element <img> amb un atribut class i diversos atributs data- *:

<img class="spaceship cruiserX3" src="shipX3.png"
  data-ship-id="324"   data-weapons="laserI laserII"   data-shields="72%"
  data-x="414354" data-y="85160" data-z="31940"
  onclick="spaceships[this.dataset.shipId].blasted()"
</img>

(Veure més aquí)

Especificacions

Especificació Estat Comentari
WHATWG HTML Living Standard
The definition of 'data-*' in that specification.
Living Standard Sense canvis des de l'última instantània, HTML5.1
HTML5.1
The definition of 'data-*' in that specification.
Recommendation Instantània de WHATWG HTML Living Standard, sense canvis des de HTML5
HTML5
The definition of 'data-*' in that specification.
Recommendation Instantània de WHATWG HTML Living Standard, definició inicial.

Característica Chrome Firefox (Gecko) Internet Explorer Opera Safari
Suport bàsic (Yes) 6 (6) (Yes) (Yes) (Yes)
Característica Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Suport bàsic (Yes) 6.0 (6) (Yes) (Yes) (Yes) (Yes)

Veure

Document Tags and Contributors

 Contributors to this page: Legioinvicta
 Last updated by: Legioinvicta,