轻松上手,快乐学习!

HTML data-* 属性



实例

使用 data-* 属性来嵌入自定义数据:

<ul>
  <li data-animal-type="bird">Owl</li>
  <li data-animal-type="fish">Salmon</li>
  <li data-animal-type="spider">Tarantula</li>
</ul>
亲自试一试 »

定义和用法

data-* 属性用于存储私有页面后应用的自定义数据。

data-* 属性可以在所有的 HTML 元素中嵌入数据。

自定义的数据可以让页面拥有更好的交互体验(不需要使用 Ajax 或去服务端查询数据)。

data-* 属性由以下两部分组成:

  1. 属性名不要包含大写字母,在 data- 后必须至少有一个字符。
  2. 该属性可以是任何字符串

注释: 自定义属性前缀 "data-" 会被客户端忽略。


浏览器支持

表中的数字表示支持该属性的第一个浏览器版本。

属性
data-* 4.0 5.5 2.0 3.1 9.6

语法

<element data-*="somevalue">

属性值

描述
somevalue 指定属性值 (一个字符串)

相关页面

HTML 教程: HTML 属性

HTML DOM 参考手册: HTML DOM getAttribute() 方法