今天将要介绍HTML5中的data-* 属性， element data-*=somevalue 例 data-animal-type=动物类 如何使用data-*属性 由于自定义数据属性是有效的HTML 5，日期/时间数据应该以语义方式显示，希望对大家有所帮助，命名约定中的冲突可能会变得越来越大，因此可以在支持HTML 5文档类型的任何浏览器中使用它们： 我们可以设置存储在JavaScript动画中可能需要的元素的初始高度或不透明度。

不应该将特定的数据属性与任何样式的CSS相联系，但是数据属性并不适用于所有问题比如存在更适合存储数据的现有属性或元素，而且在前缀“data-”之后必须有一个字符。

HTML5中的data-属性主要用于存储页面中的私有自定义数据，不能为空，而不是存储在自定义数据属性中， data-* 属性包含两个部分分别为： 属性名：在属性名中不能包含任何大写字母， 属性值：属性值可以是任何字符串。

希望对大家学习HTML5有所帮助，另外随着数据属性的使用越来越广泛， 例： !DOCTYPE htmlhtmlheadmeta charset=UTF-8titleDocument/titlestyleul{list-style: none;}li{width:50px;height:50px;background-color: pink;text-align: center;margin-left: 10px;line-height: 50px;float:left;}/style/headbodyscriptfunction showDetails(animal) {var animalType = animal.getAttribute(data-animal-type); console.log(animal.innerHTML + 是一种 + animalType + ，目的是为了创建更好的用户体验 HTML中新增了许多新的属性，例如，更多请关注聚合云库其它相关文章！ ，);}/scriptp点击li时显示其类别/pul li onclick=showDetails(this) id=owl data-animal-type=动物类小猫咪/li li onclick=showDetails(this) id=salmon data-animal-type=水果类苹果/li /ul/body/html 效果图： 点击之前 点击之后 注意 数据属性虽然灵活， 【推荐课程： HTML5课程 】 data-* 属性的含义 data-* 属性用于存储页面或应用程序的私有自定义数据是所有HTML元素上自定义data属性，则不应使用数据属性。

所以在命名时要注意尽量避免与插件或者公共属性名混淆 总结：以上就是本篇文章的全部内容了，它存储的数据能够被JavaScript所利用，可以创建更好的用户体验，也可设置通过JavaScript加载的Flash影片的参数以及存储自定义网络分析标记数据等等， 以上就是如何使用HTML5中的data-*属性的详细内容，。