1. <div id="box" aaa="bbb" data-info="hello"></div>
  2. <body>
  4. <script>
  5. var box = document.getElementsByTagName("div")[0];
  6. console.log(box.dataset['info']);
  7. console.log(box.id);//box
  8. console.log(box.aaa);//undefined 标签的自定义属性无法映射到对象身上
  9. console.log(box.getAttribute('aaa'));//bbb 自定义属性需要使用getAttribute进行获取
  11. /*
  12. * HTML5的属性设置与读取
  13. * */
  14. box.setAttribute('data-my-name','liyinghao');//data-my:liyinghao
  15. console.log(box.dataset['myName']);//liyinghao
  16. box.getAttribute('myName');//不能获取到属性值
  18. </script>
 

HTML5自定义属性的设置与获取的更多相关文章

  1. 关于H5中自定义属性的设置和获取

    自定义数据属性是在HTML5中新加入的一个特性.简单来说,自定义数据属性规范规定任何以data-开头属性名并且赋值.自定义数据属性是为了保存页面或者应用程序的私有自定义数据,这些自定义数据属性保存进D ...

  2. JQuery自定义属性的设置和获取

    Jquery操作自定义属性的方法,很简洁: $("#test").attr("test","aaa") // 设置 $("#tes ...

  3. JS自定义属性的设置与获取

    以前感觉用JQuery来设置自定义属性很方便,现在没有用JQuery,要用原生的JavaScript来操作自定义属性. Jquery操作自定义属性的方法,很简洁: $("#test" ...

  4. HTML5自定义属性之data-*

    HTML5 增加了一项新功能是 自定义数据属性 ,也就是  data-* 自定义属性.在HTML5中我们可以使用以 data- 为前缀来设置我们需要的自定义属性,来进行一些数据的存放.当然高级浏览器下 ...

  5. HTML5自定义属性对象Dataset简介

    一.html5 自定义属性介绍 我之前翻译的“你必须知道的28个HTML5特征.窍门和技术”一文中对于HTML5中自定义合法属性data-已经做过些介绍,就是在HTML5中我们可以使用data-前缀设 ...

  6. jQuery中使用data()方法读取HTML5自定义属性data-*实例

    如果你使用jQuery类库,那么你可以非常愉悦的使用jquery的data()方法存取data-* 自定义属性,方法允许我们在DOM元素上绑定任意类型的数据,避免了循环引用的内存泄漏风险 主要的方法如 ...

  7. Jquery 操作HTML5自定义属性data-*

    HTML5自定义属性规范的写法<a data-roleid="12"></a>,也可以直接写<a roleid="12">& ...

  8. HTML5自定义属性操作

    一.自定义属性(html5标准)data-属性名称="属性值" 自定义属性的名称驼峰式命名规则需要用-隔开 自定义属性名称如果连在一起写,大写会自动转为小写 data-user=& ...

  9. js设置、获取单值cookie和多值cookie

    js设置.获取单值cookie和多值cookie,代码如下: var CookieUtil = (function () { var Cookie = function () { // 获取单值coo ...

随机推荐

  1. getjob

    [op@TIM getpage]$ cat job.py #coding: utf- #title..href... import urllib.request import time url=[ p ...

  2. python 100day notes(2)

    python 100day notes(2) str str2 = 'abc123456' print(str1.endswith('!')) # True # 将字符串以指定的宽度居中并在两侧填充指 ...

  3. java并发编程笔记（三）——线程安全性

    java并发编程笔记(三)--线程安全性 线程安全性: ​ 当多个线程访问某个类时,不管运行时环境采用何种调度方式或者这些进程将如何交替执行,并且在主调代码中不需要任何额外的同步或协同,这个类都能表现 ...

  4. 55、saleforce 学习笔记二

    String goodsName = 'abcd1123汉字显示';//测试文本 System.debug('简化后的字符串名称为:'+goodsName.abbreviate(5)); //返回简化 ...

  5. Oracle10gr2 开机自启动脚本

    目录 目录 软件环境 Oracle服务启动停止重启脚本 软件环境 操作系统 RHEL6.1 软件 Oracle10gr2 Oracle服务启动.停止.重启脚本 su - oracle cd /u01/ ...

  6. Nginx网络架构实战学习笔记（一）：Nginx简介、安装、信号控制、nginx虚拟主机配置、日志管理、location 语法、Rewrite语法详解

    文章目录 nginx简介 nginx安装 nginx信号控制 nginx虚拟主机配置 日志管理 location 语法 精准匹配的一般匹配 正则匹配 总结 Rewrite语法详解 nginx简介 Ng ...

  7. 使用IDEA快速搭建Springboot项目

    Spring Boot是由Pivotal团队提供的全新框架,设计目的是用来简化新Spring应用的初始搭建以及开发过程.它主要推崇的是'消灭配置’,实现零配置. 下面就介绍一下如何使用idea快速搭建 ...

  8. csdn加入暂时会话功能

    版权声明:本文为博主原创文章.若要转载请注明出处! ^_^ https://blog.csdn.net/u010892841/article/details/25334153             ...

  9. Python第五节 元组

    Python第八节 元组补充 元组从形式上看,和列表唯一不同的在于,列表是中括号,元组是小括号 元组内的元素不可更改 一. 创建 创建直接在小括号内写元素,用逗号隔开就好 创建空元祖只写一个小括号 元 ...

  10. Linux入门命令

    ####常用的目录 /主目录 ① /root:存放启动Linux时启动的核心文件,包括一些连接文件以及镜像 ② /bin:binary的缩写,存放经常使用的命令 ③ /dev:Device(设备)的缩 ...