在HTML5中添加了data-*的方式来自定义属性，所谓data-*实际上上就是data-前缀加上自定义的属性名,命名可以用驼峰命名方式，但取值是必需全部使用小写，使用这样的结构可以进行数据存放。使用data-*可以解决自定义属性混乱无管理的现状。
1. Html绑定数据写法
1.1简单单词：
<div id="testDiv" data-cd="24">
Click Here
</div>
1.2 使用驼峰命名（需要特定注意的地方）：
<div id="testDiv" data-cartCd="24">
Click Here
</div>
2. 取绑定的值方法
原生的js取法：
var testDiv = document.getElementById('testDiv');
简单的单词：console.log(testDiv.dataset.cd);
复杂的驼峰命名单词：console.log(testDiv.dataset.cartcd);
//注意是“cartcd”,不管是不是驼峰命名，一切都是小写。
使用Jquery方法：
console.log($(“#testDiv”).data(“cd”));
console.log($(“testDiv”).data(“cartcd”));//同上面一样，注意是“cartcd”,不管
//是不是驼峰命名，一切都是小些。
和html5的api不同的是，jQuery会尝试将字符串转换为一个JavaScript值（包括布尔值（booleans），数字（numbers），对象（objects），数组（arrays）和空（null））。
3. 修改绑定数据
原生js方式:
testDiv.dataset.cartcd= “新值”
Jquery方式：
$(“testDiv”).data(“cartcd”,”新值”)
其实这个属性是html5新加的特性，为了绑定数据，我们可以将一些参数绑定到dom标签上，而不用将数据填 到input标签上然后隐藏该标签。最需要注意的一点的取值时必需全部使用小写的名字，”data-*”中名子可以用驼峰命名。