HTML data-* 屬性
HTMLdata-*屬性
HTML 全局屬性
實例
使用 data-* 屬性來嵌入自定義數據:
<ul>
<li data-animal-type="bird">Owl</li>
<li data-animal-type="fish">Salmon</li>
<li data-animal-type="spider">Tarantula</li>
</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-* 屬性用于存儲私有頁面后應用的自定義數據。
data-* 屬性可以在所有的 HTML 元素中嵌入數據。
自定義的數據可以讓頁面擁有更好的交互體驗(不需要使用 Ajax 或去服務端查詢數據)。
data-* 屬性由以下兩部分組成:
- 屬性名不要包含大寫字母,在 data- 后必須至少有一個字符。
- 該屬性可以是任何字符串
注意:自定義屬性前綴 "data-" 會被客戶端忽略。
HTML 4.01 與 HTML5之間的差異
data-* 屬性是 HTML5 新增的。
語法
<elementdata-*="somevalue">
屬性值
值 | 描述 |
---|---|
somevalue | 指定屬性值 (一個字符串) |
HTML 全局屬性