Dados HTML-* Atributos


Exemplo

Use o atributo data-* para incorporar dados personalizados:

<ul>
  <li data-animal-type="bird">Owl</li>
  <li data-animal-type="fish">Salmon</li>
  <li data-animal-type="spider">Tarantula</li>
</ul>

Definição e uso

Os data-*atributos são usados ​​para armazenar dados personalizados privados para a página ou aplicativo.

Os data-*atributos nos dão a capacidade de incorporar atributos de dados personalizados em todos os elementos HTML.

Os dados armazenados (personalizados) podem ser usados ​​no JavaScript da página para criar uma experiência de usuário mais envolvente (sem chamadas Ajax ou consultas de banco de dados do lado do servidor).

Os data-*atributos consistem em duas partes:

  1. O nome do atributo não deve conter letras maiúsculas e deve ter pelo menos um caractere após o prefixo "data-"
  2. O valor do atributo pode ser qualquer string

Observação: os atributos personalizados prefixados com "data-" serão completamente ignorados pelo agente do usuário.


Suporte ao navegador

Os números na tabela especificam a primeira versão do navegador que suporta totalmente o atributo.

Attribute
data-* 4.0 5.5 2.0 3.1 9.6

Sintaxe

<element data-*="somevalue">

Valores de atributo

Value Description
somevalue Specifies the value of the attribute (as a string)

Páginas relacionadas

Tutorial HTML: Atributos HTML

Referência HTML DOM: Método HTML DOM getAttribute()