天天看点

html5标签的data-*属性用法简单介绍

此属性是html5新增的属性。使用它可以存储用户自定的属性。

使用javascript可以访问这些自定义的属性。

语法结构:

<code>&lt;</code><code>element</code> <code>data-*="somevalue"&gt;</code>

语法规范如下:

1.属性名称不能够有大写字母。

2.属性名称分为两个部分,"data-"是固定的前缀,后面是任意合法的字符串名称。

3.属性值可以是任意合法的字符串。

代码实例:

<code>&lt;</code><code>ul</code><code>&gt;</code>

<code>  </code><code>&lt;</code><code>li</code> <code>data-css</code><code>=</code><code>"css"</code><code>&gt;css教程&lt;/</code><code>li</code><code>&gt;</code>

<code>  </code><code>&lt;</code><code>li</code> <code>data-js</code><code>=</code><code>"javascript"</code><code>&gt;javascript教程&lt;/</code><code>li</code><code>&gt;</code>

<code>  </code><code>&lt;</code><code>li</code> <code>data-jquery</code><code>=</code><code>"jquery"</code><code>&gt;jquery教程&lt;/</code><code>li</code><code>&gt;</code>

<code>&lt;/</code><code>ul</code><code>&gt;</code>

原文发布时间为:2017-2-19

本文作者:admin

本文来自云栖社区合作伙伴“蚂蚁部落”,了解相关信息可以关注蚂蚁部落

继续阅读