jQuery .data 和 .attr 奇怪的行为？

Question

谁能解释在下面的小提琴中发现的奇怪的 jquery 行为？

http://jsfiddle.net/HSyS6/2/

我有以下 html...

<div id="test" data-prevy="0"></div>

使用下面的 jquery...

console.log($('#test').data('prevy'));
console.log($('#test').attr('data-prevy'));

$('#test').attr('data-prevy', 2);

console.log($('#test').data('prevy'));
console.log($('#test').attr('data-prevy'));

$('#test').attr('data-prevy', 1);

console.log($('#test').data('prevy'));
console.log($('#test').attr('data-prevy'));

哪些输出...

0
0
0
2
0
1

当我期望它输出时...

0
0
2
2
1
1

我意识到如果你通过 .data (IE: .data('prevy', 2);) 设置值，该值将不会反映在 DOM 中，但我正在做相反的事情并得到更多意想不到的结果.

Answer 1

.data() 不会设置或更改元素的属性，它只是最初获取它的值，然后更新存储在 jQuery 中的元素的内部对象。

内部数据第一次初始化后，它永远不会返回属性来获取或设置值，因此如果你已经使用了.data，更新属性不会更新存储在.data()中的内容元素。

由于您只更新属性，内部存储的数据永远不会更新，只会更新属性。这是预期的行为。

供参考，https://github.com/jquery/jquery/blob/1.9-stable/src/data.js