怎么获取HTML5自定义数据属性data的值 _电脑：win7，64位

很多做web开发的小伙伴，不知道怎么使用HTML5的data属性，下面小编就将操作方法演示给大家，供大家参考学习！

文章插图

需要这些哦
电脑：win7 ， 64位
软件：HbuilderX
方式/
1打开开辟东西，新建一个HTML文件（为了便利给大师演示）

文章插图

2在HTML标签上设置data属性：
语法：data-*

文章插图

3利用原生JS获取自界说数据属性的值
方式：.getAttribute()
例子： document.getElementById("demo1").getAttribute("data-num")

文章插图

4打开浏览器开辟者东西，点击【console】可以看到我当作功的获取到data的值了

文章插图

5利用jquery获取自界说数据属性的值
方式：.attr() 或.data()
例子：
1、var a = $("#demo1").attr("data-type");
2、var b = $("#demo2").data("type");

文章插图

6打开浏览器开辟者东西，点击console查看获取环境：

文章插图

方式总结：11、新建一个HTML文件
2、在HTML标签上设置data属性
3、利用原生JS：getAttribute()方式获取自界说数据属性的值
4、利用jquery方式：attr() 或data()获取自界说数据属性的值
【怎么获取HTML5自定义数据属性data的值】5、打开浏览器开辟者东西查抄获取环境

注重事项tips1：本教程设置的参数只是为了便利给大师演示，现实环境现实开辟！
tips2：本教程供给了， JQ或原生JS两种方式，按照需求选择！

以上内容就是怎么获取HTML5自定义数据属性data的值的内容啦，希望对你有所帮助哦！