jquery data() 使用

首先看一下语法

向元素附加数据

向被选元素附加数据。

语法

$(selector).data(name,value)

参数	描述
name	必需。规定要设置的数据的名称。
value	必需。规定要设置的数据的值。

从元素返回数据

从被选元素中返回附加的数据。

语法

$(selector).data(name)

参数	描述
name	可选。规定要取回的数据的名称。 如果没有规定名称，则该方法将以对象的形式从元素中返回所有存储的数据。

如页面有如下元素：

<div id="mydiv"  data-app="mydata">this is div</div>

使用jquery 方法

<script type="text/javascript">

$(function() {

alert($("#mydiv").data("app")) //mydata  

alert($("#mydiv").data("app","123"))//赋值为123

alert($("#mydiv").data("app"))//123 只是修改了缓存中的值 并没有改变标签中的值

alert($("#mydiv").attr('data-app'))//mydata  

})

</script>

HTML5规定可以为元素添加非标准型的属性，只需添加前缀data-，这些属性可以随意添加，随意命名，目的是为元素提供与渲染无关的信息，或提供语义信息。

var mydiv = document.getElementById('mydiv');

alert(mydiv.dataset.dataapp) //123

data-前缀属性可以在JS中通过dataset取值，更加方便