.att() vs .data()

Diferenças entre o uso do método .attr() e o método .data()

by mgibsonbr

HTML

<div id="teste" data-foo="10"></div>

JavaScript

console.log("Inicialmente: " + $("#teste").data("foo"));
$("#teste").data("foo", 20);
console.log("Depois de dar valor: " + $("#teste").data("foo"));
$("#teste").attr("data-foo", 30);
console.log("Depois de mexer no atributo: ainda " + $("#teste").data("foo"));
$("#teste").removeData("foo");
console.log("Depois de remover o valor: " + $("#teste").data("foo"));