.data()

O método .data() permite-nos ler dados previamente associados a elementos DOM. Podemos recuperar vários valores distintos para um único elemento, um de cada vez, ou como um conjunto:

1
2
3
4
5
6
7

Chamar .data() sem parâmetros retorna um objeto JavaScript contendo cada valor armazenado como propriedade. O objeto pode ser usado diretamente para obter valores de dados (mas note que nomes de propriedades contendo originalmente traços terão sido modificados conforme descrito abaixo).

Desde jQuery 3, cada seqüência de dois caracteres de “-” (U+002D) seguida por uma letra ASCII em minúsculas em uma chave é substituída pela versão em maiúsculas da letra, em alinhamento com a API do conjunto de dados HTML. Uma instrução como $( "body" ).data( { "my-name": "aValue" } ).data(); irá retornar { myName: "aValue" }.

HTML5 data-* Atributos

Desde jQuery 1.4.3, data-* atributos são usados para inicializar os dados jQuery. Os atributos data-* de um elemento são recuperados na primeira vez em que o método data() é invocado, e então não são mais acessados ou alterados (todos os valores são armazenados internamente por jQuery).

Tudo as tentativas são feitas para converter o valor da string do atributo para um valor JavaScript (isto inclui booleans, números, objetos, arrays, e nulos). Uma string só é convertida para um número se isso não mudar sua representação (por exemplo, a string “100” é convertida para o número 100, mas “1E02” e “100.000” são deixados como strings porque seu valor numérico de 100 serializa para “100”). Quando uma string começa com ‘{‘ ou ‘[‘, então jQuery.parseJSON é utilizada para analisá-la; deve seguir a sintaxe válida do JSON, incluindo nomes de propriedade citados. Uma string não analisável como um valor JavaScript não é convertida.

Para recuperar um valor de atributo data-* como uma string não convertida, use o método attr().

Desde jQuery 1.6, os traços em data-* nomes de atributo foram processados em alinhamento com a API do conjunto de dados HTML.

Por exemplo, dado o seguinte HTML:

1

As seguintes comparações são todas verdadeiras:

1
2
3
4

Deixe uma resposta

O seu endereço de email não será publicado.