Html5 data属性

作用

设置标签的data属性可以存放数据,这个数据不会直接在界面上显示出来,只在需要的时候才提取出来使用。

 

存放数据1

<div id="myDiv" data-myname="Macro K"></div>

 

存放数据2

<script>
$(function () {
    $("#myDiv").data({"myname": "Macro K"});
});
</script>

 

获取数据

<script>
$(function () {
    alert($("#myDiv").data("myname"));
});
</script>

 

存放Json数据1

<div id="myDiv" data-myname='{"firstname":"Macro","lastname":"K"}'></div>

 

存放Json数据2

<script>
$("#myDiv").data({ "myname": { "firstname": "Macro", "lastname": "K" }});
</script>

 

获取Json数据

<script>
$(function () {
    alert($("#myDiv").data("myname").firstname);
});
</script>

 

注意

  • data属性名不能包含有大写字母。
  • JQuery1.4.3版本以及之后的版本才支持data方法。
posted @ 2018-10-26 01:14  RexChou  阅读(125)  评论(0)    收藏  举报