From d432316fb3b875f305d88098b24f58bdf611b647 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9E=97=E6=99=97=E5=B8=8C?= <2095000342@qq.com>
Date: Sun, 24 Nov 2024 14:01:23 +0000
Subject: [PATCH 1/3] =?UTF-8?q?=E4=BD=9C=E4=B8=9A=E4=B8=8A=E4=BC=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: 林晗希 <2095000342@qq.com>
---
 ...02\347\202\271\346\223\215\344\275\234.md" | 224 ++++++++++++++++++
 1 file changed, 224 insertions(+)
 create mode 100644 "20241122 \350\212\202\347\202\271\346\223\215\344\275\234.md"
diff --git "a/20241122 \350\212\202\347\202\271\346\223\215\344\275\234.md" "b/20241122 \350\212\202\347\202\271\346\223\215\344\275\234.md"
new file mode 100644
index 0000000..5183abb
--- /dev/null
+++ "b/20241122 \350\212\202\347\202\271\346\223\215\344\275\234.md"	
@@ -0,0 +1,224 @@
+# 作业
+
+#### 1、08.2-点击关闭
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+  <style>
+    .box {
+      position: relative;
+      width: 1000px;
+      height: 200px;
+      background-color: pink;
+      margin: 100px auto;
+      text-align: center;
+      font-size: 50px;
+      line-height: 200px;
+      font-weight: 700;
+    }
+
+    .box1 {
+      position: absolute;
+      right: 20px;
+      top: 10px;
+      width: 20px;
+      height: 20px;
+      background-color: skyblue;
+      text-align: center;
+      line-height: 20px;
+      font-size: 16px;
+      cursor: pointer;
+    }
+  </style>
+</head>
+
+<body>
+  <div class="box">
+    我是广告1
+    <div class="box1">X</div>
+  </div>
+  <div class="box">
+    我是广告2
+    <div class="box1">X</div>
+  </div>
+  <div class="box">
+    我是广告3
+    <div class="box1">X</div>
+  </div>
+  <script>
+    // 关闭广告挑战
+    // 挑战1：关闭广告1
+    const body = document.querySelector('body')
+    // console.log(body.children[0]);
+    // body.children[0];
+    const x1=document.querySelector(body.children[0].children)
+    const g1=document.querySelector(body.children[0])
+    console.log(body.children[0].children);    广告1的关闭按钮
+    // x1.addEventListener('click',function(){
+    //   g1.
+    // })
+
+    // 挑战2：获取三个广告
+
+    // 挑战3：如何优化
+
+  </script>
+</body>
+
+</html>
+```
+
+#### 2、学生信息表案例
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+  <title>学生信息管理</title>
+  <link rel="stylesheet" href="css/index.css" />
+</head>
+
+<body>
+  <h1>新增学员</h1>
+  <form action='http://www.baidu.com/s?' class="info" autocomplete="off">
+    姓名：<input type="text" class="uname" name="uname" />
+    年龄：<input type="text" class="age" name="age" />
+    性别:
+    <select name="gender" class="gender">
+      <option value="男">男</option>
+      <option value="女">女</option>
+    </select>
+    薪资：<input type="text" class="salary" name="salary" />
+    就业城市：<select name="city" class="city">
+      <option value="北京">北京</option>
+      <option value="上海">上海</option>
+      <option value="广州">广州</option>
+      <option value="深圳">深圳</option>
+      <option value="曹县">曹县</option>
+    </select>
+    <button class="add">录入</button>
+
+
+  </form>
+
+
+
+  <h1>就业榜</h1>
+  <table>
+    <thead>
+      <tr>
+        <th>学号</th>
+        <th>姓名</th>
+        <th>年龄</th>
+        <th>性别</th>
+        <th>薪资</th>
+        <th>就业城市</th>
+        <th>操作</th>
+      </tr>
+    </thead>
+    <tbody>
+      <!-- 
+        <tr>
+          <td>1001</td>
+          <td>欧阳霸天</td>
+          <td>19</td>
+          <td>男</td>
+          <td>15000</td>
+          <td>上海</td>
+          <td>
+            <a href="javascript:">删除</a>
+          </td>
+        </tr> 
+        -->
+    </tbody>
+  </table>
+  <script>
+    const students = [];
+    const elements = [];
+    const from = document.querySelector('.info');
+    const button = document.querySelector('.add');
+    const tbody = document.querySelector('tbody');
+
+    from.addEventListener('submit', function (e) {
+      e.preventDefault();
+
+      const childrens = from.children;
+      for (let i = 0; i < childrens.length; i++) {
+        if (childrens[i].name) {
+          if (!childrens[i].value) {
+            return alert(`${childrens[i].name} 还未填写`);
+          }
+        }
+      }
+
+      for (let i = 0; i < childrens.length; i++) {
+        if (childrens[i].name) {
+          elements.push(childrens[i]);
+        }
+      }
+
+      const object = {};
+
+      object.id = students.length === 0 ? 1 : +students[students.length - 1].id + 1;
+
+      for (let element = 0; element < elements.length; element++) {
+        object[elements[element].name] = elements[element].value;
+      }
+
+      students.push(object);
+
+      show();
+
+      this.reset();
+    })
+
+    tbody.addEventListener('click', function (e) {
+      if (e.target.tagName === 'A') {
+        students.splice(e.target.dataset.id, 1);
+        show();
+      }
+    })
+
+    function show() {
+      tbody.innerHTML = '';
+
+      // 遍历学生数组
+      for (let i = 0; i < students.length; i++) {
+        const tr = document.createElement('tr');
+
+        tr.innerHTML = `
+            <td>${students[i].id}</td>
+            <td>${students[i][[elements[0].name]]}</td>
+            <td>${students[i][[elements[1].name]]}</td>
+            <td>${students[i][[elements[2].name]]}</td>
+            <td>${students[i][[elements[3].name]]}</td>
+            <td>${students[i][[elements[4].name]]}</td>
+            <td><a href="javascript:" data-id=${i}>删除</a></td>
+        `;
+
+        tbody.appendChild(tr);
+      }
+    }
+    
+
+
+
+  </script>
+
+</body>
+
+</html>
+```
+
+
-- 
Gitee


From f61f12ff4f4c6ccd7d25b545ca3ad2ade30b77a4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9E=97=E6=99=97=E5=B8=8C?= <2095000342@qq.com>
Date: Sun, 24 Nov 2024 14:01:31 +0000
Subject: [PATCH 2/3] =?UTF-8?q?=E5=88=A0=E9=99=A4=E6=96=87=E4=BB=B6=202024?=
 =?UTF-8?q?1122=20=E8=8A=82=E7=82=B9=E6=93=8D=E4=BD=9C.md?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ...02\347\202\271\346\223\215\344\275\234.md" | 224 ------------------
 1 file changed, 224 deletions(-)
 delete mode 100644 "20241122 \350\212\202\347\202\271\346\223\215\344\275\234.md"

diff --git "a/20241122 \350\212\202\347\202\271\346\223\215\344\275\234.md" "b/20241122 \350\212\202\347\202\271\346\223\215\344\275\234.md"
deleted file mode 100644
index 5183abb..0000000
--- "a/20241122 \350\212\202\347\202\271\346\223\215\344\275\234.md"	
+++ /dev/null
@@ -1,224 +0,0 @@
-# 作业
-
-#### 1、08.2-点击关闭
-
-```html
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-  <meta charset="UTF-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Document</title>
-  <style>
-    .box {
-      position: relative;
-      width: 1000px;
-      height: 200px;
-      background-color: pink;
-      margin: 100px auto;
-      text-align: center;
-      font-size: 50px;
-      line-height: 200px;
-      font-weight: 700;
-    }
-
-    .box1 {
-      position: absolute;
-      right: 20px;
-      top: 10px;
-      width: 20px;
-      height: 20px;
-      background-color: skyblue;
-      text-align: center;
-      line-height: 20px;
-      font-size: 16px;
-      cursor: pointer;
-    }
-  </style>
-</head>
-
-<body>
-  <div class="box">
-    我是广告1
-    <div class="box1">X</div>
-  </div>
-  <div class="box">
-    我是广告2
-    <div class="box1">X</div>
-  </div>
-  <div class="box">
-    我是广告3
-    <div class="box1">X</div>
-  </div>
-  <script>
-    // 关闭广告挑战
-    // 挑战1：关闭广告1
-    const body = document.querySelector('body')
-    // console.log(body.children[0]);
-    // body.children[0];
-    const x1=document.querySelector(body.children[0].children)
-    const g1=document.querySelector(body.children[0])
-    console.log(body.children[0].children);    广告1的关闭按钮
-    // x1.addEventListener('click',function(){
-    //   g1.
-    // })
-
-    // 挑战2：获取三个广告
-
-    // 挑战3：如何优化
-
-  </script>
-</body>
-
-</html>
-```
-
-#### 2、学生信息表案例
-
-```html
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-  <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
-  <title>学生信息管理</title>
-  <link rel="stylesheet" href="css/index.css" />
-</head>
-
-<body>
-  <h1>新增学员</h1>
-  <form action='http://www.baidu.com/s?' class="info" autocomplete="off">
-    姓名：<input type="text" class="uname" name="uname" />
-    年龄：<input type="text" class="age" name="age" />
-    性别:
-    <select name="gender" class="gender">
-      <option value="男">男</option>
-      <option value="女">女</option>
-    </select>
-    薪资：<input type="text" class="salary" name="salary" />
-    就业城市：<select name="city" class="city">
-      <option value="北京">北京</option>
-      <option value="上海">上海</option>
-      <option value="广州">广州</option>
-      <option value="深圳">深圳</option>
-      <option value="曹县">曹县</option>
-    </select>
-    <button class="add">录入</button>
-
-
-  </form>
-
-
-
-  <h1>就业榜</h1>
-  <table>
-    <thead>
-      <tr>
-        <th>学号</th>
-        <th>姓名</th>
-        <th>年龄</th>
-        <th>性别</th>
-        <th>薪资</th>
-        <th>就业城市</th>
-        <th>操作</th>
-      </tr>
-    </thead>
-    <tbody>
-      <!-- 
-        <tr>
-          <td>1001</td>
-          <td>欧阳霸天</td>
-          <td>19</td>
-          <td>男</td>
-          <td>15000</td>
-          <td>上海</td>
-          <td>
-            <a href="javascript:">删除</a>
-          </td>
-        </tr> 
-        -->
-    </tbody>
-  </table>
-  <script>
-    const students = [];
-    const elements = [];
-    const from = document.querySelector('.info');
-    const button = document.querySelector('.add');
-    const tbody = document.querySelector('tbody');
-
-    from.addEventListener('submit', function (e) {
-      e.preventDefault();
-
-      const childrens = from.children;
-      for (let i = 0; i < childrens.length; i++) {
-        if (childrens[i].name) {
-          if (!childrens[i].value) {
-            return alert(`${childrens[i].name} 还未填写`);
-          }
-        }
-      }
-
-      for (let i = 0; i < childrens.length; i++) {
-        if (childrens[i].name) {
-          elements.push(childrens[i]);
-        }
-      }
-
-      const object = {};
-
-      object.id = students.length === 0 ? 1 : +students[students.length - 1].id + 1;
-
-      for (let element = 0; element < elements.length; element++) {
-        object[elements[element].name] = elements[element].value;
-      }
-
-      students.push(object);
-
-      show();
-
-      this.reset();
-    })
-
-    tbody.addEventListener('click', function (e) {
-      if (e.target.tagName === 'A') {
-        students.splice(e.target.dataset.id, 1);
-        show();
-      }
-    })
-
-    function show() {
-      tbody.innerHTML = '';
-
-      // 遍历学生数组
-      for (let i = 0; i < students.length; i++) {
-        const tr = document.createElement('tr');
-
-        tr.innerHTML = `
-            <td>${students[i].id}</td>
-            <td>${students[i][[elements[0].name]]}</td>
-            <td>${students[i][[elements[1].name]]}</td>
-            <td>${students[i][[elements[2].name]]}</td>
-            <td>${students[i][[elements[3].name]]}</td>
-            <td>${students[i][[elements[4].name]]}</td>
-            <td><a href="javascript:" data-id=${i}>删除</a></td>
-        `;
-
-        tbody.appendChild(tr);
-      }
-    }
-    
-
-
-
-  </script>
-
-</body>
-
-</html>
-```
-
-
-- 
Gitee


From e73ec8818c0dd16c1d8422e14140ffef4572cd89 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9E=97=E6=99=97=E5=B8=8C?= <2095000342@qq.com>
Date: Sun, 24 Nov 2024 14:01:48 +0000
Subject: [PATCH 3/3] =?UTF-8?q?=E4=BD=9C=E4=B8=9A=E4=B8=8A=E4=BC=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: 林晗希 <2095000342@qq.com>
---
 ...02\347\202\271\346\223\215\344\275\234.md" | 224 ++++++++++++++++++
 1 file changed, 224 insertions(+)
 create mode 100644 "\346\236\227\346\231\227\345\270\214/20241024 \345\210\235\350\257\206JS/20241122 \350\212\202\347\202\271\346\223\215\344\275\234.md"

diff --git "a/\346\236\227\346\231\227\345\270\214/20241024 \345\210\235\350\257\206JS/20241122 \350\212\202\347\202\271\346\223\215\344\275\234.md" "b/\346\236\227\346\231\227\345\270\214/20241024 \345\210\235\350\257\206JS/20241122 \350\212\202\347\202\271\346\223\215\344\275\234.md"
new file mode 100644
index 0000000..5183abb
--- /dev/null
+++ "b/\346\236\227\346\231\227\345\270\214/20241024 \345\210\235\350\257\206JS/20241122 \350\212\202\347\202\271\346\223\215\344\275\234.md"	
@@ -0,0 +1,224 @@
+# 作业
+
+#### 1、08.2-点击关闭
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+  <style>
+    .box {
+      position: relative;
+      width: 1000px;
+      height: 200px;
+      background-color: pink;
+      margin: 100px auto;
+      text-align: center;
+      font-size: 50px;
+      line-height: 200px;
+      font-weight: 700;
+    }
+
+    .box1 {
+      position: absolute;
+      right: 20px;
+      top: 10px;
+      width: 20px;
+      height: 20px;
+      background-color: skyblue;
+      text-align: center;
+      line-height: 20px;
+      font-size: 16px;
+      cursor: pointer;
+    }
+  </style>
+</head>
+
+<body>
+  <div class="box">
+    我是广告1
+    <div class="box1">X</div>
+  </div>
+  <div class="box">
+    我是广告2
+    <div class="box1">X</div>
+  </div>
+  <div class="box">
+    我是广告3
+    <div class="box1">X</div>
+  </div>
+  <script>
+    // 关闭广告挑战
+    // 挑战1：关闭广告1
+    const body = document.querySelector('body')
+    // console.log(body.children[0]);
+    // body.children[0];
+    const x1=document.querySelector(body.children[0].children)
+    const g1=document.querySelector(body.children[0])
+    console.log(body.children[0].children);    广告1的关闭按钮
+    // x1.addEventListener('click',function(){
+    //   g1.
+    // })
+
+    // 挑战2：获取三个广告
+
+    // 挑战3：如何优化
+
+  </script>
+</body>
+
+</html>
+```
+
+#### 2、学生信息表案例
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+  <title>学生信息管理</title>
+  <link rel="stylesheet" href="css/index.css" />
+</head>
+
+<body>
+  <h1>新增学员</h1>
+  <form action='http://www.baidu.com/s?' class="info" autocomplete="off">
+    姓名：<input type="text" class="uname" name="uname" />
+    年龄：<input type="text" class="age" name="age" />
+    性别:
+    <select name="gender" class="gender">
+      <option value="男">男</option>
+      <option value="女">女</option>
+    </select>
+    薪资：<input type="text" class="salary" name="salary" />
+    就业城市：<select name="city" class="city">
+      <option value="北京">北京</option>
+      <option value="上海">上海</option>
+      <option value="广州">广州</option>
+      <option value="深圳">深圳</option>
+      <option value="曹县">曹县</option>
+    </select>
+    <button class="add">录入</button>
+
+
+  </form>
+
+
+
+  <h1>就业榜</h1>
+  <table>
+    <thead>
+      <tr>
+        <th>学号</th>
+        <th>姓名</th>
+        <th>年龄</th>
+        <th>性别</th>
+        <th>薪资</th>
+        <th>就业城市</th>
+        <th>操作</th>
+      </tr>
+    </thead>
+    <tbody>
+      <!-- 
+        <tr>
+          <td>1001</td>
+          <td>欧阳霸天</td>
+          <td>19</td>
+          <td>男</td>
+          <td>15000</td>
+          <td>上海</td>
+          <td>
+            <a href="javascript:">删除</a>
+          </td>
+        </tr> 
+        -->
+    </tbody>
+  </table>
+  <script>
+    const students = [];
+    const elements = [];
+    const from = document.querySelector('.info');
+    const button = document.querySelector('.add');
+    const tbody = document.querySelector('tbody');
+
+    from.addEventListener('submit', function (e) {
+      e.preventDefault();
+
+      const childrens = from.children;
+      for (let i = 0; i < childrens.length; i++) {
+        if (childrens[i].name) {
+          if (!childrens[i].value) {
+            return alert(`${childrens[i].name} 还未填写`);
+          }
+        }
+      }
+
+      for (let i = 0; i < childrens.length; i++) {
+        if (childrens[i].name) {
+          elements.push(childrens[i]);
+        }
+      }
+
+      const object = {};
+
+      object.id = students.length === 0 ? 1 : +students[students.length - 1].id + 1;
+
+      for (let element = 0; element < elements.length; element++) {
+        object[elements[element].name] = elements[element].value;
+      }
+
+      students.push(object);
+
+      show();
+
+      this.reset();
+    })
+
+    tbody.addEventListener('click', function (e) {
+      if (e.target.tagName === 'A') {
+        students.splice(e.target.dataset.id, 1);
+        show();
+      }
+    })
+
+    function show() {
+      tbody.innerHTML = '';
+
+      // 遍历学生数组
+      for (let i = 0; i < students.length; i++) {
+        const tr = document.createElement('tr');
+
+        tr.innerHTML = `
+            <td>${students[i].id}</td>
+            <td>${students[i][[elements[0].name]]}</td>
+            <td>${students[i][[elements[1].name]]}</td>
+            <td>${students[i][[elements[2].name]]}</td>
+            <td>${students[i][[elements[3].name]]}</td>
+            <td>${students[i][[elements[4].name]]}</td>
+            <td><a href="javascript:" data-id=${i}>删除</a></td>
+        `;
+
+        tbody.appendChild(tr);
+      }
+    }
+    
+
+
+
+  </script>
+
+</body>
+
+</html>
+```
+
+
-- 
Gitee

