HTML5自定义属性data-*和jQuery.data详解

新的HTML5标准允许你在普通的元素标签里，嵌入类似data-*的属性，来实现一些简单数据的存

新的HTML5标准允许你在普通的元素标签里，嵌入类似data-*的属性，来实现一些简单数据的存取。它的数量不受限制，并且也能由Javascript动态修改，也支持CSS选择器进行样式设置。这使得data属性特别灵活，也非常强大。有了这样的属性我们能够更加有序直观的进行数据预设或存储。下面介绍HTML5 Dataset 存储的实际应用，以及包括jQuery在内的四种存取方式。

HTML5 Dataset 存储的例子

为一个元素分配data属性存储数据，例如这是一个span元素，它的内容是一首音乐的名称，我们为其HTML标签里直接预置这首歌的更多信息，在HTML源码上看起来可以这样来写：

data-date="2013" data-genre="Electronic" data-album="Settle (Deluxe)" data-artist="Disclosure" data-composer="Howard Lawrence & Guy Lawrence"> Latch (feat. Sam Smith)

这样，我们就很简单的为这首歌在span标签里直接内嵌了其专辑、艺术家和流派信息。

继续围观此文

相关文章:

1. 无需插件实现 jQuery 平滑滚动
2. jQuery Scroll (jQuery平滑滚动) 插件
3. 用history api"偷换"浏览器历史记录
4. jQuery hash 插件
5. jQuery Background Position Animate (jQuery背景位置变换) 插件
6. jQuery Color Animate (jQuery 颜色变换动画) 插件
7. 不刷新改变URL: pushState + Ajax
8. 加载 jQuery 的正确方式