Attributo data-* del DOM HTML

Definizione e uso

data-* L'attributo viene utilizzato per memorizzare dati personalizzati privati della pagina o dell'applicazione.

data-* L'attributo ci dà la capacità di inserire attributi personalizzati data su tutti gli elementi HTML.

I dati memorizzati (personalizzati) possono essere utilizzati dal JavaScript della pagina per creare una migliore esperienza utente (senza chiamate Ajax o query di database sul lato server).

data-* L'attributo è composto da due parti:

  • Il nome dell'attributo non dovrebbe contenere lettere maiuscole e deve avere almeno un carattere dopo il prefisso "data-"
  • Il valore dell'attributo può essere una stringa arbitraria

Attenzione: l'utente agente ignorerà completamente le proprietà personalizzate con prefisso "data-".

Vedi anche:

Tutorial HTML:Proprietà HTML

Manuale di riferimento del DOM HTML:Metodo getAttribute() del DOM HTML

Esempio

Incorpora dati personalizzati utilizzando l'attributo data-*:

<ul>
  <li data-animal-type="鸟类">喜鹊</li>
  <li data-animal-type="鱼类">金枪鱼</li>
  <li data-animal-type="蜘蛛">蝇虎</li>
</ul>

Prova da solo

Sintassi

<element data-*="somevalue">

Valore dell'attributo

Valore Descrizione
somevalue Definire il valore della proprietà (come stringa).

Supporto del browser

I numeri nella tabella indicano la versione del browser che supporta la proprietà per la prima volta.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 5.5 2.0 3.1 9.6