Ao modificar um determinado valor inicial do data
do jQuery, notei que o valor do dataset
não é modificado.
Daí elaborei o seguinte teste:
HTML:
<div data-value="initial value" id="div-test-1"></div>
<div data-value="initial value" id="div-test-2"></div>
jQuery:
Primeiro teste:
$(function(){
var $div1 = $('#div-test-1')
console.log($div1.data('value')); // intial value
$div1.data('value', 'new value');
console.log($div1.data('value')) // new value
console.log($div1.prop('dataset').value); // initial value
});
Segundo teste:
$(function(){
var $div2 = $('#div-test-2');
console.log($div2.data('value')) ;// intial value
$div2.attr('data-value', 'new value');
console.log($div2.data('value')); // initial value
console.log($div2.prop('dataset').value); // new value
});
Ou seja, para definições feita com data()
, os valores foram alterados para o jQuery, mas não para o attributo dataset
; e, quando alterados no dataset
, não são retornadas pelo data()
como esperado.
Existe também outra diferença: Podemos definir valores do tipo Number
, Array
e Object
através do data
do jQuery. Já o dataset
NÃO faz isso.
Veja:
Exemplo com dataset
:
$('body').get(0).dataset.element = {nome: "wallace"};
console.log($('body').get(0).dataset.element) // [object Object]
Exemplo com data
do jQuery:
$('body').data('element', {nome: 'wallace'});
console.log($('body').data('element')); // {nome: 'wallace'}
- Baseando-se nesse exemplo, podemos afirmar que o jQuery NÃO usa o
dataset
do HTML5? - E, se "sim" para a primeira pergunta, existe alguma razão específica dele fazer isso?
- É seguro usar o
dataset
em projetos em que eu não vou usar o jQuery? - Porque eles se comportam diferentes no que diz respeito aos tipos retornados?