在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. 取绑定的值方法
2.1原生的js取法：
var testDiv = document.getElementById('testDiv');
简单的单词：console.log(testDiv.dataset.cd);
复杂的驼峰命名单词：console.log(testDiv.dataset.cartcd); //注意是“cartcd”,不管是不是驼峰命名，一切都是小写。
2.2使用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”,”新值”)
4. 开发过程中的使用方式
其实这个属性是html5新加的特性，为了绑定数据，我们可以将一些参数绑定到dom标签上，而不用将数据填 到input标签上然后隐藏该标签。”data-*”中名子可以用驼峰命名，最需要注意的一点的取值时必需全部使用小写的名字，否则将会取不到所需要的值。