init

2023-05-01 19:37:40 +08:00
commit da2c0fadf7
133 changed files with 29002 additions and 0 deletions
--- a/Html-Javascript/12-dom3.html
+++ b/Html-Javascript/12-dom3.html
@@ -0,0 +1,65 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <style>
+        #app {
+            width: 300px;
+            height: 200px;
+            background-color: salmon;
+        }
+        .box {
+            border: solid 5px #ccc;
+            color: salmon;
+        }
+        .box2 {
+            font-size: 30px;
+        }
+    </style>
+</head>
+<body>
+<div id="app">
+    被点了怎模板!","我很记仇的这是你点击我的第"+i+"下
+</div>
+
+<script>
+
+    //修改样式
+    let app = document.querySelector("#app");//获取dom
+
+    //2-1直接写行内样式
+    // dom.style.样式属性(多单词变驼峰) = "样式属性值"
+    // app.style.color="pink";
+    // app.style.fontSize="25px";
+    // app.style.border="solid 10px #CCC";
+
+    //2-2修改class
+    // app.className = "box box2"; //有缺陷,不好修改, 不建议
+    // app.className = "box2 "; 
+
+    //查
+    console.log(app.classList);
+
+    //增
+    app.classList.add("box");
+
+    //删
+    app.classList.remove("box");
+
+    //切换  有就删, 无就增加
+    app.classList.toggle("box");
+
+
+    //3.修改属性
+    //dom.属性 = "xxxx";
+    app.title ="我设置了title";
+    
+
+
+
+</script>
+
+</body>
+</html>