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

时间:2013-04-30 20:39:17

标签: jquery html

有人能解释下面这个小提琴中发现的奇怪的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中,但我正在做相反的事情并获得更多意想不到的结果

1 个答案:

答案 0 :(得分:7)

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

首次初始化内部数据后,它永远不会返回到属性来获取或设置值,因此如果您已经使用{更新属性,则不会更新.data()中存储的内容关于该元素的{1}}。

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

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