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

哈哈 是我太弱了

<!DOCTYPE html>
<html> <head>
<title>dataset</title>
<meta charset="utf-8">
</head> <body>
<div id='div' data-index='demo'>
</div>
</body>
<script type="text/javascript">
var a = document.getElementById('div');
console.log(a)
console.log(a.dataset.index)//demo
</script> </html>

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

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

a.getAttribute('data-index')

==>"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. BZOJ Lydsy5月月赛 ADG题解

    题目链接 BZOJ5月月赛 题解 好弱啊QAQ只写出三题 A 判断多干个数乘积是否是某个数的倍数有很多方法,比较常用的是取模,但这里并不适用,因为模数不定 会发现数都比较小,所以我们可以考虑分解质因子 ...

  2. NOIP系列

    NOIP2015运输计划 唉 真是 这题 卡死我了 tarjan离线lca复杂度O(n) 最后各种卡常,多交几遍才A(洛谷104ms) %%%zk学长609ms 注意二分的时候左边界要定成0 根据题意 ...

  3. JavaScript中的函数与栈

    Javascript中会经常用到setTimeout来推迟一个函数的执行,如: setTimeout(function(){ alert("Hello World"); },100 ...

  4. 一款基础模型的JS打飞机游戏特效代码

    <!DOCTYPE html> <html lang="en"> <head> <title>一款基础模型的JS打飞机游戏特效代码& ...

  5. ACE的安装

    转载于:http://www.cnblogs.com/TianFang/archive/2006/12/03/580714.html ACE的安装是一件比较麻烦的事情,这里简单的记录了我在VS2005 ...

  6. squid总结

    squid可以完成的工作: 代理服务器 反向代理服务器 防火墙 缓存功能 透明代理 squid和varnish的对比,以及squid的优缺点说明: 缓存到硬盘,容易遇到I/O瓶颈 V3.2以下不支持多 ...

  7. POJ 2429 long long 质因数分解

    GCD & LCM Inverse Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 16206   Accepted: ...

  8. HDU3231拓扑排序

    Box Relations Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Tot ...

  9. Nginx简介及使用Nginx实现负载均衡的原理【通俗易懂,言简意赅】【转】

    Nginx 这个轻量级.高性能的 web server 主要可以干两件事情: 直接作为http server(代替apache,对PHP需要FastCGI处理器支持): 另外一个功能就是作为反向代理服 ...

  10. wcf 服务创建,配置,测试

    一.WCF创建: 常规的创建WCF服务是通过SOAP传输的,很多网站开发人员想放弃使用XML而使用JSON,这个时候可以参照:http://www.cnblogs.com/zhili/p/WCFRes ...