| 123456789101112131415161718192021222324252627282930313233343536 |
- <!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 id="box" data-name="box1" data-aa-bb="ab">这是一个盒子</div>
- <!--
- 给元素自定义属性
- dom.属性名 = 属性值
- 设置：
- 1.dom.dataset.属性名 = '属性值'
- 2.dom.setAttribute('属性名',属性值)
- 读取：
- 1.dom.dataset.属性名
- 2.dom.getAttribute('属性名')
- -->
- <script>
- var box = document.getElementById("box");
- box.dataset.age = 18;
- box.dataset.sex = '女';
- box.aa = '11';
- console.log(box.aa)
- console.log(box.dataset.age)
- console.log(box.dataset.sex)
- console.log(box.dataset.name)
- // 驼峰命名法
- console.log(box.dataset.aaBb)
-
- box1.setAttribute('address','哈尔滨');
- console.log(box.getAttribute('address'))
- </script>
- </body>
- </html>
|
