init

2023-05-01 19:37:40 +08:00
commit da2c0fadf7
133 changed files with 29002 additions and 0 deletions
--- a/Html-Javascript/10-dom-获取dom.html
+++ b/Html-Javascript/10-dom-获取dom.html
@@ -0,0 +1,67 @@
+<!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="app">
+        app
+      <div class="box"></div>  
+      <ul>
+          <li>我是li1</li>
+          <li>我是li2</li>
+          <li>我是li3</li>
+          <li>我是li4</li>
+          <li>我是li5</li>
+      </ul>
+    </div>
+
+
+    <script>
+
+        //00-获取dom
+        //选择 单
+        let app=document.querySelector("#app"); //参数为css中的选择器
+        //选择 多
+        let li = document.querySelectorAll("#app ul li");
+
+        // 01-获取的特殊的dom
+        // let html = document.documentElement;
+        // console.log(html);
+
+        //获取body的dom
+        // let body =document.body;
+        // console.log(body);
+
+        //获取header的dom
+        // let head = document.head;
+        // console.log(head);
+        
+        //获取title的dom
+        // let title = document.title;
+        // console.log(title);
+
+
+
+
+        //查看 确定自己是否已经获取了dom
+        // console.dir(app);
+        // console.log(app);
+
+        // console.log(li);
+        // console.dir(li);
+
+        //获取dom的主要用于:
+        //1.添加事件
+        //2.修改样式
+        //3.修改属性
+        //4.修改标签内容
+
+    </script>
+
+
+
+</body>
+</html>