jQuery中的data方法只能获取不能设置值？

data([key],[value]) 在元素上存放或读取数据,返回jQuery对象

上面是在jQuery手册中的截取，“存放”数据？

先看代码

<div id="div1" data-test="test">1</div>
<script>
    console.log($("#div1").data("test"));//test
</script>

OK，读取是正常的。
再来，

<div id="div1" data-test="test">1</div>
<script>
    $("#div1").data("test","name");
</script>

这里看一下元素

奇怪，怎么data-test的值还是test？

回去看手册，

当参数为两个时，为像该jQuery对象对应的DOM中存储key-value键值对的数据

似乎没有发现什么问题，或者可以打印一下

<div id="div1" data-test="test">1</div>
<script>
    $("#div1").data("test","name");
    console.log($("#div1").data("test"));//name
</script>

再输出的时候发现$(“#div1”).data(“test”)的值是“name”
而元素中依然是

<div id="div1" data-test="test">1</div>

先了解一下data

其实是这样的，当我们执行例如这样的语句时 $(“#id”).data(“test”); (简化后的过程)

第一步: jQuery 会获取到 $(“#id”) 元素，对吧、
第二步: 执行到 data方法 的时候，他会通过 attributes 取我们要的对应值。
第三步:返回结果给我们，然后 jQuery 把值缓存到内部对象里 第一次取的时候，我们可以得到的undefined，字符串，数字或者解析后的json。

那有人会说这个和 attr 有什么区别呢？ 当我们第二次执行$(“#id”).data(“test”); 的时候：

第一步: jQuery 会获取到 $(“#id”) 元素，和上面一样。
第二步:执行到 data方法 的时候，从 jQuery 的缓存中取值
为什么不是从 attributes 取值，而是从缓存中取呢？
缓存其实是js的对象，简单说就类似 var cache = {};
jQuery 在第一次取值之后就会保存到这个缓存对象中，这样我们再次操作的时候就非常快了、 往往性能的损耗都是在 dom 操作上，所以避免重复操作 dom 是非常必要的。

以上转载自http://www.jb51.net/article/51215.htm

现在可以看到，data方法确实给在元素上存放或读取数据
而这个存放，实质上并没有改变元素的上的data属性，而是在缓存中为该对象设置了一个值，在以后的获取中，也是直接的得到缓存中的一个值。

其实这样会有一个问题，就是不能正常获得元素中的属性值，
如果不了解这个机制的人，可能会掉下坑就爬不起来了。
(果然还是有必要了解一下jquery的源码啊)

至于设置元素上的data属性值，可以用attr()方法吧