我以前一直以为只能用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. POJ1741 tree 【点分治】

    Tree Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 25286   Accepted: 8421 Description ...

  2. Nginx 配置解析

    概述:本篇文章主要对Nginx配置文件中一些常用配置进行了讲解,和如何使用Docker进行安装Nginx.因为该文章是回首在工作闲暇之余整理的,还有待完善,如果有疑义和更好的建议的朋友可以留言给我. ...

  3. 关于移动DSP

    提  纲 1.移动DSP与传统营销有什么不同? 2.为什么移动DSP是大势所趋? 3.哪些因素决定移动DSP的精准与否? 4.如何辨别移动DSP的真伪优劣? 5.不同行业的广告主如何用好移动DSP? ...

  4. CSS图片宽度设置百分比 , 高度同宽度相同

    在图片长宽不相等的情况下,想将长宽设置为相等并且自适应屏幕,可以通过 js 的方式进行设置并通过监听 resize 来实时更新,但是这种方式很麻烦. 这里通过 css 来达到我们想要的效果: < ...

  5. POJ 1014 / HDU 1059 Dividing 多重背包+二进制分解

    Problem Description Marsha and Bill own a collection of marbles. They want to split the collection a ...

  6. iOS 时间转换

    #pragma mark - 获取当前时间戳 -(NSString *)getTimeSp{ NSDate* dat = [NSDate dateWithTimeIntervalSinceNow:]; ...

  7. 【poj2947】高斯消元求解同模方程组【没有AC,存代码】

    题意: p start enda1,a2......ap (1<=ai<=n)第一行表示从星期start 到星期end 一共生产了p 件装饰物(工作的天数为end-start+1+7*x, ...

  8. 【BZOJ1926】【SDOI2010】粟粟的书架 [主席树]

    粟粟的书架 Time Limit: 30 Sec  Memory Limit: 552 MB[Submit][Status][Discuss] Description 幸福幼儿园 B29 班的粟粟是一 ...

  9. 【BZOJ】4558: [JLoi2016]方

    [题意]给定有(n+1)*(m+1)个点的网格图,其中指定k个点不合法,求合法的正方形个数(四顶点合法). [算法]计数 [题解]斜着的正方形很麻烦,所以考虑每个斜正方形其外一定有正的外接正方形. 也 ...

  10. HDU 1159 Common Subsequence (dp)

    题目链接 Problem Description A subsequence of a given sequence is the given sequence with some elements ...