2013-04-30 26 views
1

任何人都可以解释在下面的小提琴找到奇怪的jquery行为?jQuery .data和.attr奇怪的行为?

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 

当我w乌尔德指望它输出...

0 
0 
2 
2 
1 
1 

我意识到,如果你通过设置的。数据值(即:。数据(“prevy”,2);),该值将不会在DOM反映,但我正在做相反的事情,并得到更多意想不到的结果。

回答

7

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

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

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

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

+0

我不希望它改变属性,我希望它得到我通过'.attr更新属性()'新值。 – lionpants 2013-04-30 20:43:49

+1

看起来它正在成功获取新的属性值 - “失败”的调用是使用'.data'的调用。 – 2013-04-30 20:44:54

+1

它不是,也不应该如我所解释的那样。我将它分成两部分,以便更强调它。 – 2013-04-30 20:45:22