HTML data-*全局属性

• 

  data-*属性定义和用法

  data-*属性用于存储页面或应用程序专用的自定义数据。
  data-*属性使我们能够在所有HTML元素上嵌入自定义数据属性。
  然后，可以在页面的JavaScript中使用存储的（自定义）数据来创建更具吸引力的用户体验（无需任何Ajax调用或服务器端数据库查询）。
  data-*属性由两部分组成：

  • 属性名称不应包含任何大写字母，并且在前缀“data-”之后必须至少有一个字符。
  • 属性值可以是任何字符串

  注意：用户代理将完全忽略以“data-”为前缀的自定义属性。

• 

  data-*属性浏览器支持

  Internet Explorer	Chrome	FireFox	Safari	Opera
  5.5（含）以上	4.0（含）以上	2.0（含）以上	3.1（含）以上	9.6（含）以上

• 

  HTML4.01和HTML5之间的差异

  data-*属性是HTML5中的新增属性。

• 

  data-*属性语法

  <element data-*="somevalue">

• 

  data-*属性实例

  <li onclick="showDetails(this)" id="owl" data-animal-type="鸟类">猫头鹰</li>
  <li onclick="showDetails(this)" id="salmon" data-animal-type="鱼类">三文鱼</li>  
  <li onclick="showDetails(this)" id="tarantula" data-animal-type="蜘蛛">狼蛛</li>  

  尝试一下
• 

  data-*属性值

  属性值	描述
  somevalue	指定属性的值（作为字符串）

• 

  data-*属性相关页面

  HTML教程：HTML属性