编程 Javascript

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

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

- Author -

jingxian

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

基于jQuery的倒计时插件代码

May 07 Javascript

使用jquery读取html5 localstorage的值的方法

Jan 04 Javascript

jquery 获取标签名(tagName)示例代码

Jul 11 Javascript

JS模式之单例模式基本用法

Jun 30 Javascript

javascript伸缩型菜单实现代码

Nov 16 Javascript

jQuery 全选全部选反选实现代码

Aug 17 Javascript

详解Node.js开发中的express-session

May 19 Javascript

jQuery序列化后的表单值转换成Json

Jun 16 jQuery

详解小程序毫秒级倒计时（适用于拼团秒杀功能）

May 05 Javascript

js利用递归与promise 按顺序请求数据的方法

Aug 30 Javascript

Vue双向绑定实现原理与方法详解

May 07 Javascript

jQuery实现广告显示和隐藏动画

Jul 04 jQuery

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

剧场版动画《PSYCHO-PASS 3 FIRST INSPECTOR》3月27日日本上映！

2020/03/06 日漫

ThinkPHP CURD方法之where方法详解

2014/06/18 PHP

php 计算两个时间相差的天数、小时数、分钟数、秒数详解及实例代码

2016/11/09 PHP

TP5框架实现自定义分页样式的方法示例

2020/04/05 PHP

在chrome中window.onload事件的一些问题

2010/03/01 Javascript

JQuery select控件的相关操作实现代码

2012/09/14 Javascript

JS自定义对象实现Java中Map对象功能的方法

2015/01/20 Javascript

node.js中的forEach()是同步还是异步呢

2015/01/29 Javascript

jQuery 实现评论等级好评差评特效

2016/05/06 Javascript

微信支付 JS API支付接口详解

2016/07/11 Javascript

详解Weex基于Vue2.0开发模板搭建

2017/03/20 Javascript

JS实现发送短信验证后按钮倒计时功能(防止刷新倒计时失效)

2017/07/07 Javascript

JS库之Highlight.js的用法详解

2017/09/13 Javascript

使用vue的transition完成滑动过渡的示例代码

2018/06/25 Javascript

jquery ajax 请求小技巧实例分析

2019/11/11 jQuery

Vue toFixed保留两位小数的3种方式

2020/10/23 Javascript

详细探究Python中的字典容器

2015/04/14 Python

基于python的Tkinter实现一个简易计算器

2015/12/31 Python

Python随机读取文件实现实例

2017/05/25 Python

Tornado高并发处理方法实例代码

2018/01/15 Python

Python3.6.0+opencv3.3.0人脸检测示例

2018/05/25 Python

对python捕获ctrl+c手工中断程序的两种方法详解

2018/12/26 Python

如何利用Python分析出微信朋友男女统计图

2019/01/25 Python

详解Python正则表达式re模块

2019/03/19 Python

python3 打印输出字典中特定的某个key的方法示例

2019/07/06 Python

python如何爬取网站数据并进行数据可视化

2019/07/08 Python

利用ImageAI库只需几行python代码实现目标检测

2019/08/09 Python

原来我一直安装 Python 库的姿势都不对呀

2019/11/11 Python

解析pip安装第三方库但PyCharm中却无法识别的问题及PyCharm安装第三方库的方法教程

2020/03/10 Python

django 模版关闭转义方式

2020/05/14 Python

Python3+PyCharm+Django+Django REST framework配置与简单开发教程

2021/02/16 Python

Gap工厂店：Gap Factory

2017/11/02 全球购物

知识改变命运演讲稿

2014/05/21 职场文书

公司租房协议书范本

2014/10/08 职场文书

离婚协议书样本

2015/01/26 职场文书

酒店辞职信怎么写

2015/02/27 职场文书