1234567891011121314151617181920212223242526272829303132 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Document</title>
- </head>
- <body>
- <div data-name="Box1" data-aa-nn="first-nn">这是一个盒子</div>
- <!--
- 给元素自定义属性
- 1.box.dataset.属性名 = 属性值
- 2.box.setAttribute('属性名',属性值)
- 读取:
- 1.box.dataset.属性名
- 2.box.getAttribute('属性名')
- -->
- <script>
- var box = document.querySelector("div");
- console.log(box)
- box.dataset.index = 1;
- box.dataset.sex = '女';
- box.setAttribute("data-age",10);
- box.setAttribute("ss",20)
- console.log(box.dataset.index,'index')
- // 驼峰命名法读取
- console.log(box.dataset.aaNn,'aa')
- console.log(box.getAttribute("name"))
- </script>
- </body>
- </html>
|