data-* 属性包括两部分:

属性名不应该包含任何大写字母,并且在前缀 "data-" 之后必须有至少一个字符;

属性值可以是任意字符串;

注释:用户代理会完全忽略前缀为 "data-" 的自定义属性。

与jQuery的.data()不是一个概念。

在获取自定义属性的值时,使用dataset属性,然后通过自定义属性(这时去掉data-前缀)的名称去获取值。dataset是JS5规范中新增加的属性,用于和data-*配合使用。

需要注意:

1)如果data-后面包含了“-”,例如 date-e-name,"-"会去掉,并转换成为骆驼峰式的命名 eName。这是因为JSON Object 的key不能包含”-“。

2)如果data-后面的单词有大写,例如 myName,将会转存成小写 myname。这里就不理解为什么会转换成小写了,JSON Object的key是区分大小写的。

3)如果你想删除一个data-*属性,请使用 delete dataset.cname或者dataset.cname=null。

HTML5中的data-*属性的更多相关文章

  1. HTML5 中的新属性autocomplete="off"失效的解决方法(兼容firefox,IE,360)

    因为业务需求,在写一个注册页面的时候,发现浏览器会自动填充此域名下已经保存的账号密码,给用户带来不便.加了HTML5 中的新属性autocomplete="off" ,但是并没有产 ...

  2. 小强的HTML5移动开发之路(13)——HTML5中的全局属性

    来自:http://blog.csdn.net/dawanganban/article/details/18179483 一.accssskey  快捷键 <!DOCTYPE HTML> ...

  3. Vue组件中的data属性

    Vue中的data属性专门用来以对象方式存放数据,它有两种用法. var vm=new Vue({ data:{a:1,b:2,}, }) var vm=new Vue({ data(){return ...

  4. html5中的全局属性

    在html5中,新增了一个"全局属性"的概念,所谓全局属性,是指可以对任何属性都使用的属性.下面列出常用的全局属性. 1.contentEditable属性,是微软开发的,该属性主 ...

  5. HTML5中class选择器属性的解释

    设置有class属性值的元素,可以被css中的选择器调用,也可以在javascript中以getElementsByClassName()方法调用. 可以给各个元素添加class而且名称可以相同与id ...

  6. 测试开发之前端——No4.HTML5中的事件属性

    HTML5的事件属性. 属性 值 描述 onafterprint script 在打印文档之后运行脚本 onbeforeprint script 在文档打印之前运行脚本 onbeforeonload ...

  7. 测试开发之前端——No3.HTML5中的标准属性

    HTML5的标准属性 属性 值 描述 accesskey character 规定访问元素的键盘快捷键 class classname 规定元素的类名(用于规定样式表中的类). contentedit ...

  8. Vue2 实例中的 data 属性三种写法与作用:

    <script src="https://unpkg.com/vue/dist/vue.js"></script> <div id="app ...

  9. 辛星浅析html5中的role属性

    我们使用role属性告诉辅助设备.这个元素所扮演的角色.比方点击的按钮,我们通常就使用role="button",会让这个元素可点击. 可是它很多其它的是用来增强语义性,当现有的h ...

  10. Vue2实例中的data属性三种写法与作用

    <script src="https://unpkg.com/vue/dist/vue.js"></script> <div id="app ...

随机推荐

  1. python --- 对于需要关联的接口处理方法

    1.unittest对于需要关联的请求,怎么处理(如购物接口,需要先登录) a)把登录请求写到测试用例类的setUP函数中,这样每次调用测试用例,都会先执行setUP函数 b)全局变量的形式声明. c ...

  2. tx2的一些系统命令

    查看TX2 ubuntu系统版本命令:https://blog.csdn.net/zhengxiangwen/article/details/60324802 sudo uname --m

  3. Kubernetes1-K8s的简单介绍(转载)

    一.简介 1.什么是Kubernetes 简称K8s,用8代替8个字符"ubernerte"而成的速写,K8s是一个开源的容器编排平台,它是一个跨主机集群的开源容器调度平台,用于管 ...

  4. 剑指offer_1.18_Day_2

    怠惰怠惰,好好练练了要 二维数组中查找 在一个二维数组中(每个一维数组的长度相同),每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序.请完成一个函数,输入这样的一个二维数组和一个 ...

  5. 2.9 初识 jetpack

    Android Jetpack 组件 Android Jetpack 组件是库的集合 这些库是为协同工作而构建的,也可以单独采用,同时利用 Kotlin 语言功能帮助提高工作效率.可全部使用,也可混合 ...

  6. Java生鲜电商平台-如何使用微服务来架构生鲜电商B2B2C平台?

    Java生鲜电商平台-如何使用微服务来架构生鲜电商B2B2C平台? 说明:随着互联网的日益普及,人们通过手机下单买菜的人越来越多,生鲜这个行业有两个显著的特点,一个是刚需.(你每天都要吃饭,都要吃菜) ...

  7. ucosiii 学习笔记

    OSTaskCreate 的参数中有一个 void *p_ext,这个参数用来传递额外的信息,可以用来传递数组,结构体等等. AppTaskStart --> CPU_Init --> C ...

  8. Android进阶——多线程系列之四大线程池的使用介绍

    线程池一直是初学者最抵触的东西,由于刚开始学习做项目并不会涉及到线程池的使用,但是不去学习它,心里又好像有个石头一直沉着,一直放心不下,其实是很简单的东西,早晚都要学,不如趁现在吧.由于文章从初学者的 ...

  9. 《Thinking in Java》中讲到了final,发现自己有部分地方迷糊

    1.1当给全局的静态字段加上final时,系统是不会给其赋默认值的,若不手动初始化,会编译时错误——Variable 'xxx' might not have been initialized. 1. ...

  10. POJ 1844:Sum ”滚动“数组

    Sum Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 10494   Accepted: 6895 Description ...