我以前一直以为只能用jquery的data()来获取

哈哈 是我太弱了

  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5.     <title>dataset</title>
  6.     <meta charset="utf-8">
  7. </head>
  8.  
  9. <body>
  10.     <div id='div' data-index='demo'>
  11.     </div>
  12. </body>
  13. <script type="text/javascript">
  14. var a = document.getElementById('div');
  15. console.log(a)
  16. console.log(a.dataset.index)//demo
  17. </script>
  18.  
  19. </html>

　直接用dataset就可以获取到DOM元素的data属性

好吧，还可以 用js的获取属性的方法getAttribute()

  1. a.getAttribute('data-index')
  2.  
  3. ==>"demo"

js 获取html5的data属性的更多相关文章

  1. js 获取和设置css3 属性值的实现方法

    众多周知 CSS3 增加了很多属性,在读写的时候就没有原先那么方便了. 如:<div style="left:100px"></div> 只考虑行间样式的话 ...

  2. 【翻译】详解HTML5 自定义 Data 属性

    原标题:HTML5 Custom Data Attributes (data-*) 你是否曾经使用 class 或 rel 来保存任意的元数据,只为了使你的JavaScript更简单?如果你回答是的, ...

  3. js 获取DOM的style属性

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. HTML5自定义data属性

    可能大家在使用jquery mobile时,经常会看到data-role.data-theme等的使用,比如:通过如下代码即可实现页眉的效果: [html] <div data-role=&qu ...

  5. 【转载】HTML5自定义data属性

    可能大家在使用jquery mobile时,经常会看到data-role.data-theme等的使用,比如:通过如下代码即可实现页眉的效果:   [html]  <div data-role= ...

  6. js获取一个对象的所以属性和值

    在HTML DOM中,获取某个元素对象的时候,往往记不住它的很多属性,可以通过下面的例子来查找一下: <!DOCTYPE html> <html> <body> & ...

  7. js获取元素的innerText属性为什么为空

    看这样一段内容: <div id="ii" style="visibility:hidden"> <a style="cursor: ...

  8. JS获取伪元素的属性

    window下的getComputedStyle属性.getPropertyValue属性 // 获取 .element:before 的 color 值 var color = window.get ...

  9. .net和js 获取当前url各种属性

    转来 假设当前页完整地址是:http://www.test.com:80/aaa/bbb.aspx?id=5&name=kelli "http://"是协议名 " ...

随机推荐

  1. AtCoder Regular Contest 075 E - Meaningful Mean(树状数组)

    题目大意:求一个数组中,平均值不小于k的连续子序列个数 所有数减去k,算个前缀和出来,就变成二维数点问题了. 没有修改,离线的话就是CZL所说的“NOIP最喜欢的套路”了:倒着加进BIT,以权值为数组 ...

  2. BZOJ2791 Rendezvous

    Description给定一个n个顶点的有向图,每个顶点有且仅有一条出边.对于顶点i,记它的出边为(i, a[i]).再给出q组询问,每组询问由两个顶点a.b组成,要求输出满足下面条件的x.y:1. ...

  3. Change the IPTables log file

    http://www.networkinghowtos.com/howto/change-the-iptables-log-file/     An important aspect of any f ...

  4. Spring 容器AOP的实现原理——动态代理

    参考:http://wiki.jikexueyuan.com/project/ssh-noob-learning/dynamic-proxy.html(from极客学院) 一.介绍 Spring的动态 ...

  5. mysql的时间函数整理

      转:这里总结的非常齐全: http://fengbin2005.iteye.com/blog/1999763   Mysql时间函数 对于每个类型拥有的值范围以及并且指定日期何时间值的有效格式的描 ...

  6. lvs学习总结

    看的马哥的视频 NAT1.Director的DIP地址与集群节点必须在同一个网络中[vlan或者subnat] .RIP地址通常是私有地址,仅用于和DIP进行通信 .Director处理进出的所有通信 ...

  7. JQuery学习五

    获取样式attr("myclass")移除样式removeClass("myclass")增加样式addClass("myclass")to ...

  8. SDUT 3930 线段树

    皮卡丘的梦想2 Time Limit: 1000MS Memory Limit: 65536KB Submit Statistic Problem Description 一天,一只住在 501 实验 ...

  9. floor ceil

    echo floor(11/10); echo ceil(11/10); swiper  可以用在ajax的success中,如果用ejs拼接的,放ajax里面才可以轮播

  10. Android 自定义ListView实现底部分页刷新与顶部下拉刷新，androidlistview

    在项目开发中,由于数据过大时,需要进行分页加载或下拉刷新,来缓解一次性加载的过长等待.本篇博文实例讲解通过自定义的ListView实现底部分页加载和顶部下拉刷新的效果. 其效果图: 一.ListVie ...