js 获取html5的data属性实现方法


Posted in Javascript onJuly 28, 2017

我以前一直以为只能用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属性实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript json2 使用方法
Mar 16 Javascript
Google 静态地图API实现代码
Nov 19 Javascript
js弹出层之1:JQuery.Boxy (二)
Oct 06 Javascript
jQuery中需要注意的细节问题小结
Dec 06 Javascript
jquery插件开发注意事项小结
Jun 04 Javascript
兼容FF和IE的动态table示例自写
Oct 21 Javascript
javascript写的异步加载js文件函数(支持数组传参)
Jun 07 Javascript
jquery实现页面百叶窗走马灯式翻滚显示效果的方法
Mar 12 Javascript
Vuex利用state保存新闻数据实例
Jun 28 Javascript
SeaJS中use函数用法实例分析
Oct 10 Javascript
vue + typescript + 极验登录验证的实现方法
Jun 27 Javascript
js实现点赞效果
Mar 16 Javascript
jQuery获取table表中的td标签(实例讲解)
Jul 28 #jQuery
浅谈JS中的常用选择器及属性、方法的调用
Jul 28 #Javascript
js原生代码实现轮播图的实例讲解
Jul 28 #Javascript
js弹性势能动画之抛物线运动实例详解
Jul 27 #Javascript
js学习总结之dom2级事件基础知识详解
Jul 27 #Javascript
Angular指令之restict匹配模式的详解
Jul 27 #Javascript
Angularjs的$http异步删除数据详解及实例
Jul 27 #Javascript
You might like
重料打造自己的“宝马”---第三代
2021/03/02 无线电
php访问数组最后一个元素的函数end()用法
2015/03/18 PHP
PHP简单实现断点续传下载的方法
2015/09/25 PHP
通过Jscript中@cc_on 语句识别IE浏览器及版本的代码
2011/05/07 Javascript
js过滤HTML标签以及空格的思路及代码
2013/05/24 Javascript
如何从jQuery的ajax请求中删除X-Requested-With
2013/12/11 Javascript
Node.js 服务器端应用开发框架 -- Hapi.js
2014/07/29 Javascript
用Jquery选择器计算table中的某一列某一行的合计
2014/08/13 Javascript
js实现简单鼠标跟随效果的方法
2015/04/10 Javascript
JS时间特效最常用的三款
2015/08/19 Javascript
JavaScript中setter和getter方法介绍
2016/07/11 Javascript
浅谈toLowerCase和toLocaleLowerCase的区别
2016/08/15 Javascript
详解Vue用axios发送post请求自动set cookie
2017/05/10 Javascript
微信小程序 获取session_key和openid的实例
2017/08/17 Javascript
JavaScript实现的弹出遮罩层特效经典示例【基于jQuery】
2019/07/10 jQuery
vue中使用WX-JSSDK的两种方法(推荐)
2020/01/18 Javascript
基于Vue3.0开发轻量级手机端弹框组件V3Popup的场景分析
2020/12/30 Vue.js
[58:21]DOTA2亚洲邀请赛 4.3 突围赛 Liquid vs VGJ.T 第二场
2018/04/04 DOTA
python实现指定字符串补全空格的方法
2015/04/30 Python
python使用电子邮件模块smtplib的方法
2016/08/28 Python
python版本坑:md5例子(python2与python3中md5区别)
2017/06/20 Python
Python机器学习logistic回归代码解析
2018/01/17 Python
Win10 安装PyCharm2019.1.1(图文教程)
2019/09/29 Python
Python高级编程之消息队列(Queue)与进程池(Pool)实例详解
2019/11/01 Python
Python使用re模块验证危险字符
2020/05/21 Python
python 解决函数返回return的问题
2020/12/05 Python
CSS3 Pie工具推荐--让IE6-8支持一些优秀的CSS3特性
2014/09/02 HTML / CSS
美国运动鞋和运动服零售商:Footaction
2017/04/07 全球购物
马来西亚最大的在线隐形眼镜商店:MrLens
2019/03/27 全球购物
PREMIUM-MALL法国:行李、箱包及配件在线
2019/05/30 全球购物
创建索引时需要注意的事项
2013/05/13 面试题
2014年学习全国道德模范事迹思想汇报
2014/09/15 职场文书
优秀英文求职信范文
2015/03/19 职场文书
2015年小学二年级班主任工作总结
2015/05/21 职场文书
python自然语言处理之字典树知识总结
2021/04/25 Python
vue实现书本翻页动画效果实例详解
2022/04/08 Vue.js