|
|
@@ -0,0 +1,36 @@
|
|
|
+<!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>
|
e