怎么获取HTML5自定义数据属性data的值

工具/原料

• 电脑：win7，64位
• 软件：HbuilderX

方式/步骤

1. 1

   打开开辟东西，新建一个HTML文件（为了便利给大师演示）

   
2. 2

   在HTML标签上设置data属性：

   语法：data-*

   
3. 3

   利用原生JS获取自界说数据属性的值

   方式：.getAttribute()

   例子： document.getElementById("demo1").getAttribute("data-num")

   
4. 4

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

   
5. 5

   利用jquery获取自界说数据属性的值

   方式：.attr() 或.data()

   例子：

   1、var a = $("#demo1").attr("data-type");

   2、var b = $("#demo2").data("type");

   
6. 6

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

   

方式总结：

1. 1

   1、新建一个HTML文件

   2、在HTML标签上设置data属性

   3、利用原生JS：getAttribute()方式获取自界说数据属性的值

   4、利用jquery方式：attr() 或data()获取自界说数据属性的值

   5、打开浏览器开辟者东西查抄获取环境

注重事项

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