From 277c093d053057fccd8bee9a4396fb810199d824 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=A9=AC=E5=AE=8F=E8=BE=BE?= <2657224306@qq.com>
Date: Thu, 23 Nov 2023 20:34:32 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E4=BD=9C=E4=B8=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../1123.md"                                  | 74 +++++++++++++++++++
 1 file changed, 74 insertions(+)
 create mode 100644 "48 \351\251\254\345\256\217\350\276\276/1123.md"

diff --git "a/48 \351\251\254\345\256\217\350\276\276/1123.md" "b/48 \351\251\254\345\256\217\350\276\276/1123.md"
new file mode 100644
index 0000000..273df80
--- /dev/null
+++ "b/48 \351\251\254\345\256\217\350\276\276/1123.md"	
@@ -0,0 +1,74 @@
+<script>
+   // 声明一个空数组
+   let arr=[]
+   //获取表单
+   let info=document.querySelector('.info')
+   //获取属性元素
+   let uname=document.querySelector('.uname')
+   let age=document.querySelector('.age')
+   let gender=document.querySelector('.gender')
+   let salary=document.querySelector('.salary')
+   let city=document.querySelector('.city')
+   //获取整个表格
+   let tbody=document.querySelector('tbody')
+   //获取表单name
+   let name=document.querySelectorAll('[name]');
+   //点击录入生成一条数据追加到空数组中
+   info.addEventListener('submit',function(e){
+    //判断表单是否有值
+    for (let i = 0; i < name.length; i++) {
+      if (name[i].value=='') {
+        return alert('表单值不能为空')
+      }
+    }
+
+    //阻止默认行为
+    e.preventDefault()
+    //给获取表单值
+    let old={
+      stuId:arr.length+1,
+      uname:uname.value,
+      age:age.value,
+      gender:gender.value,
+      salary:salary.value,
+      city:city.value,
+    }
+    //将数据提交到数组中
+    arr.push(old)
+    //清空表单
+    this.reset()
+    //调用函数
+    fx()
+   });
+   //根据数组数据渲染页面
+   function fx() {
+    //清空表单重新遍历
+    tbody.innerHTML=''
+    //遍历数组
+    for (let i = 0; i < arr.length; i++) {
+      let tr=document.createElement('tr')
+      tr.innerHTML=`
+          <td>${arr[i].stuId}</td>
+          <td>${arr[i].uname}</td>
+          <td>${arr[i].age}</td>
+          <td>${arr[i].gender}</td>
+          <td>${arr[i].salary}</td>
+          <td>${arr[i].city}</td>
+          <td>
+            <a href="javascript:" data-id=${i}>删除</a>
+          </td>
+      `
+      //追加元素
+      tbody.appendChild(tr)
+    }
+   }
+   //点击删除按钮
+   tbody.addEventListener('click',function(e){
+    for (let i = 0; i < arr.length; i++) {
+      if (e.target.tagName==='A') {
+        arr.splice(e.target.dataset.id,1)
+      }
+    }
+    fx()
+   });
+  </script>
-- 
Gitee


From dcc2a1860816b9b13f70bd20f563e5dbaa32b068 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=A9=AC=E5=AE=8F=E8=BE=BE?= <2657224306@qq.com>
Date: Mon, 27 Nov 2023 18:16:31 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E4=BD=9C=E4=B8=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../1127.md"                                  | 55 +++++++++++++++++++
 1 file changed, 55 insertions(+)
 create mode 100644 "48 \351\251\254\345\256\217\350\276\276/1127.md"

diff --git "a/48 \351\251\254\345\256\217\350\276\276/1127.md" "b/48 \351\251\254\345\256\217\350\276\276/1127.md"
new file mode 100644
index 0000000..37dbc59
--- /dev/null
+++ "b/48 \351\251\254\345\256\217\350\276\276/1127.md"	
@@ -0,0 +1,55 @@
+<script>
+   let info=document.querySelector('.info')
+   let uname=document.querySelector('.uname')
+   let age=document.querySelector('.age')
+   let gender=document.querySelector('.gender')
+   let salary=document.querySelector('.salary')
+   let city=document.querySelector('.city')
+   let tbody=document.querySelector('tbody')
+
+   let arr=JSON.parse(localStorage.getItem('data'))||[]
+
+   function rend() {
+      let tr=arr.map(function(ele,index){
+       return `
+       <tr>
+          <td>${ele.stuId}</td>
+          <td>${ele.uname}</td>
+          <td>${ele.age}</td>
+          <td>${ele.gender}</td>
+          <td>${ele.salary}</td>
+          <td>${ele.city}</td>
+          <td>
+            <a href="javascript:" data-id=${ele}>删除</a>
+          </td>
+        </tr> 
+       `
+    })
+    tbody.innerHTML=tr.join('')
+   }
+
+   info.addEventListener('submit',function(e){
+    e.preventDefault()
+    if (!uname.value || !age.value || !salary.value) {
+      return alert('不能为空')
+    }
+    arr.push({
+      stuId:arr.length+1,
+      uname:uname.value,
+      age:age.value,
+      gender:gender.value,
+      salary:salary.value,
+      city:city.value,
+    })
+    rend()
+    this.reset()
+    localStorage.setItem('data',JSON.stringify(arr))
+   })
+   tbody.addEventListener('click',function(e){
+    if (e.target.tagName==='A') {
+      arr.splice(e.target.dataset.id,1)
+      rend()
+      localStorage.setItem('data',JSON.stringify(arr))
+    }
+   })
+  </script>
-- 
Gitee