data-为前端开发者提供自定义的属性，这些属性集可以通过对象的dataset属性获取，不支持该属性的浏览器可以通过 getAttribute方法获取。ppk提到过使用rel属性，lightbox库推广了rel属性，HTML5提供了data-做替代，这样可以更好 地使用自定义的属性。

需要注意的是，data-之后的以连字符分割的多个单词组成的属性，获取的时候使用驼峰风格。

并不是所有的浏览器都支持.dataset属性，测试的浏览器中只有Chrome和Opera支持。

'data-'属性的作用是什么?的更多相关文章

  1. JS组件系列——使用HTML标签的data属性初始化JS组件

    前言:最近使用bootstrap组件的时候发现一个易用性问题,很多简单的组件初始化都需要在JS里面写很多的初始化代码,比如一个简单的select标签,因为仅仅只是需要从后台获取数据填充到option里 ...

  2. 小甲鱼PE详解之IMAGE_OPTIONAL_HEADER32 结构定义即各个属性的作用（PE详解03）

    咱接着往下讲解IMAGE_OPTIONAL_HEADER32 结构定义即各个属性的作用! (视频教程:http://fishc.com/a/shipin/jiemixilie/) 接着我们来谈谈 IM ...

  3. 【wpf】Path画扇形以及Path的Data属性的理解

    <Path x:Name="PathFillColor" Fill="{TemplateBinding Property=Button.Background}&qu ...

  4. jQuery Mobile Data 属性

    按钮 带有 data-role="button" 的超链接.button 元素.工具栏中的链接以及 input 字段都会自动渲染成按钮样式,不需要添加 data-role=&quo ...

  5. HTML data属性简介以及低版本浏览器兼容算法

    实例 使用 data-* 属性来嵌入自定义数据: <ul> <li data-animal-type="bird">Owl</li> <l ...

  6. data属性

    本框架内置组件以及部分插件可以通过data属性来初始化并使用,通常通过data-toggle来调用API(toggle是触发器的意思,例如我们创建一个navtab标签可以通过为a的data-toggl ...

  7. HTML 5：你必须知道的data属性

    原文:All You Need to Know About the HTML5 Data Attribute 译文:你必须知道HTML 5 的Data属性 译者:dwqs HTML 5的Data属性可 ...

  8. html的标签中 unselectable=on 属性的作用

    在IE浏览器中,当input获得焦点时,点击有unselectable="on"属性的标签时,不会触发onblur事件. 加上该属性的元素不能被选中. < !DOCTYPE ...

  9. Intent的属性及Intent-filter配置——实例Action、Data属性启动系统Activity

    一旦为Intent同时指定了Action.Data属性,那么Android将可根据指定的数据类型来启动特定的应用程序,并对指定数据类型执行相应的操作. 下面是几个Action属性.Data属性的组合. ...

  10. Bootstrap入门（二十四）data属性

    Bootstrap入门(二十四)data属性 你可以仅仅通过 data 属性 API 就能使用所有的 Bootstrap 插件,无需写一行 JavaScript 代码.这是 Bootstrap 中的一 ...

随机推荐

  1. python学习第一天 -安装配置及其输入输出

    Python, 是一种面向对象.解释型计算机程序设计语言. python适合领域: 1.Web网络和各种网络服务 2.系统工具和脚本 3.作为“胶水”语言把其他语言开发的模块包装起来方便使用 pyth ...

  2. 愉快的开始 - Windows程序设计（SDK）000

    愉快的开始 让编程改变世界 Change the world by program  参考教材 购买链接:Windows程序设计(第5版)(珍藏版)(附CD-ROM光盘1张)  学习环境 视频演示:W ...

  3. silverlight中使用Json读取数据

    假定按照 如何:对基于 HTTP 的服务发出请求中描述的方法向基于 HTTP 的 Web 服务发出请求后,在 Stream 类型的 responseStream 对象中返回了下列 JSON. {&qu ...

  4. 转载收藏之用 - 微信公众平台开发教程（五）：使用Senparc.Weixin.MP SDK

    Senparc.Weixin.MP SDK已经涵盖了微信5.0的所有公共API,以及2013年10月29日升级之后大部分实用的接口. 整个项目的源代码以及已经编译好的程序集可以在这个项目中获取到:ht ...

  5. linux中查找命令find、locate、whereis、which、type区别

    linux中查找命令find.locate.whereis.which.type区别 1. find Java代码 find是最常见和最强大的查找命令,你可以用它找到任何你想找的文件.与查询数据库(/ ...

  6. Linux怎样修改系统时间

    修改linux的时间可以使用date指令 修改日期: 时间设定成2009年5月10日的命令如下: #date -s 05/10/2009 修改时间: 将系统时间设定成上午10点18分0秒的命令如下. ...

  7. keil C 应注意的几个问题

    我们使用Keil C调试某系统时积累的一些经验 1.在Windows2000下面,我们可以把字体设置为Courier,这样就可以显示正常.2.当使用有片外内存的MCU(如W77E58,它有1K片外内存 ...

  8. 阵列卡,组成的磁盘组就像是一个硬盘,pci-e扩展出sata3.0

    你想提升性能,那么组RAID0,主板上的RAID应该是软RAID,肯定没有阵列卡来得稳定.如果你有闲钱,可以考虑用阵列卡. 不会的.即使不能起到RAID的作用,起码也可以当作直接连接了2个硬盘.不会影 ...

  9. js深入研究之匿名函数

    /* 匿名函数*/ (function() { var foo = 10; var bar = 2; alert(foo * bar);})(); /* 匿名函数,带参数 */ (function(f ...

  10. 【转】Android兼容性测试CTS Verifier-环境搭建、测试执行、结果分析

    原文网址:http://www.cnblogs.com/zh-ya-jing/p/4452675.html CTS Verifier算是CTS的一部分,需要手动进行,主要用于测试那些自动测试系统无法测 ...