commit 38486911e2b99149f4a6a189ed3ca9a602bc0fb0
Author: PhuocNTB <phuocntb@mieusoft.com>
Date:   Fri May 29 21:48:54 2026 +0700

    add

diff --git a/base.js b/base.js
new file mode 100644
index 0000000..d0dbeed
--- /dev/null
+++ b/base.js
@@ -0,0 +1,121 @@
+/*
+
+Quản lý student
+
+*/
+let countId = 0;
+
+let students = [
+    {
+        id: -2,
+        name: "Phước",
+        age: 35,
+        isInLove: false,
+        gender: "male",
+        dob: "1985-12-11"
+    },
+    {
+        id: -1,
+        name: "Hương",
+        age: 25,
+        isInLove: true,
+        gender: "female",
+        dob: "1895-11-05"
+    }
+]
+
+const tbodyEL = document.querySelector("tbody")
+const formEl = document.querySelector("form")
+
+let editStudent = null;
+
+function renderUi() {
+    let tbodyHtml = ``
+
+    students.forEach((value, key) => {
+        tbodyHtml += `
+            <tr>
+                <td>${key}</td>
+                <td>${value.id}</td>
+                <td>${value.name}</td>
+                <td>${value.age}</td>
+                <td>${value.isInLove ? "có" : "không"}</td>
+                <td>${value.gender}</td>
+                <td>${value.dob}</td>
+                <td>
+                    <button onclick="deleteStudent(${value.id})">xóa</button>
+                    <button onclick="setEditStudent(${value.id})">sửa</button>
+                </td>
+            </tr>  
+        `
+    })
+
+    tbodyEL.innerHTML = tbodyHtml
+
+    formEl.querySelector("#form_title").innerHTML = editStudent ? "Sửa sinh viên" : "Thêm Sinh Viên"
+
+    if (editStudent) {
+        formEl.querySelectorAll("input")[0].value = editStudent.name;
+        formEl.querySelectorAll("input")[1].value = editStudent.age;
+        formEl.querySelectorAll("input")[editStudent.isInLove ? 2 : 3].checked = true;
+
+        let options = formEl.querySelectorAll("option");
+
+        for (op of options) {
+            if (op.value == editStudent.gender) {
+                op.selected = true;
+                break
+            }
+        }
+
+        formEl.querySelectorAll("input")[4].value = editStudent.dob;
+
+    }
+
+}
+
+function save(event) {
+    event.preventDefault();
+    let form = event.target;
+
+    let newStudent = {
+        id: editStudent ? editStudent.id : countId++,
+        name: form.name.value,
+        age: form.age.value,
+        isInLove: form.isInLove.value,
+        gender: form.gender.value,
+        dob: form.dob.value
+    }
+
+    if (editStudent) {
+        for (let i = 0; i < students.length; i++) {
+            if (students[i].id == editStudent.id) {
+                students[i] = newStudent
+                break
+            }
+        }
+    } else {
+        students.push(newStudent)
+    }
+
+
+    renderUi()
+    formEl.reset()
+    editStudent = null;
+}
+
+function deleteStudent(stuId) {
+    if (confirm("xác nhận xóa!")) {
+        students = students.filter(stu => stu.id != stuId)
+    }
+
+    renderUi()
+}
+
+function setEditStudent(stuId) {
+    editStudent = students.find(stu => stu.id == stuId)
+
+    renderUi()
+}
+
+renderUi()
\ No newline at end of file
diff --git a/for.js b/for.js
new file mode 100644
index 0000000..24eae3a
--- /dev/null
+++ b/for.js
@@ -0,0 +1,54 @@
+let employeeList = [
+    {
+        id: -1,
+        name: "Toàn",
+        age: 33,
+        gender: "male" // male, female, other
+    },
+    {
+        id: 0,
+        name: "Tiến",
+        age: 33,
+        gender: "male" // male, female, other
+    },
+    {
+        id: 1,
+        name: "Hải",
+        age: 33,
+        gender: "male" // male, female, other
+    }
+]
+
+
+
+function print() {
+    for(let i = 0; i < employeeList.length; i++) {
+        console.log(employeeList[i])
+    }
+}
+
+function logEmp(emp) {
+    console.log("emp", emp)
+}
+
+// employeeList.forEach(function logEmp(emp) {
+//     console.log("emp", emp)
+// }
+//)
+
+employeeList.forEach(function (emp, index) {
+    console.log("emp", emp, index)
+})
+
+// employeeList.forEach((emp) => {
+//     console.log("emp", emp)
+// })
+
+// employeeList.forEach(emp => console.log("emp", emp))
+
+// for(let emp of employeeList) {
+//      console.log("emp", emp)
+// }
+// for(let key in employeeList) {
+//      console.log("emp", employeeList[key])
+// }
\ No newline at end of file
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..0454d03
--- /dev/null
+++ b/index.html
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Demo Local Storage</title>
+</head>
+
+<body>
+    <table border="1">
+        <thead>
+            <tr>
+                <th>STT</th>
+                <th>ID</th>
+                <th>NAME</th>
+                <th>AGE</th>
+                <th>In Love</th>
+                <th>GENDER</th>
+                <th>DOB</th>
+                <th>TOOLS</th>
+            </tr>
+        </thead>
+        <tbody>
+            <!-- <tr>
+                <td>1</td>
+                <td>-2</td>
+                <td>aasdsa</td>
+                <td>22</td>
+                <td>có</td>
+                <td>nam</td>
+                <td>11/11/11</td>
+                <td>
+                    <button>xóa</button>
+                    <button>sửa</button>
+                </td>
+            </tr> -->
+        
+        </tbody>
+    </table>
+
+    <form onsubmit="save(event)" action="" style="border: 1px, solid black;">
+        <p id="form_title">Thêm Sinh Viên</p>
+        <input type="text" placeholder="name" name="name">
+        <br>
+        <input type="text" placeholder="age" name="age">
+        <br>
+        Trong tình yêu: Có <input type="radio" name="isInLove"> Không <input type="radio" name="isInLove">
+        <br>
+        <select name="gender">
+            <option value="male">male</option>
+            <option value="female">female</option>
+            <option value="other">other</option>
+        </select>
+        <br>
+        <input type="date" name="dob">
+        <button>lưu</button>
+    </form>
+
+    <script src="main.js"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/local-storage.js b/local-storage.js
new file mode 100644
index 0000000..f46cd02
--- /dev/null
+++ b/local-storage.js
@@ -0,0 +1,48 @@
+const employeeList = [
+    {
+        id: -1,
+        name: "Toàn",
+        age: 33,
+        gender: "male" // male, female, other
+    }
+]
+
+
+function showList() {
+    console.log("employeeList", employeeList)
+}
+
+
+function addNewEmployee() {
+    let newEmployee = {
+        id: 2,
+        name: "Hải",
+        age: 43,
+        gender: "female" // male, female, other
+    }
+
+    employeeList.push(newEmployee)
+}
+
+
+function setData() {
+    localStorage.setItem("employeeList", JSON.stringify(employeeList))
+}
+
+function readData() {
+    console.log(JSON.parse(localStorage.getItem("employeeList")))
+}
+
+localStorage.setItem("myName", "Phước")
+
+console.log(localStorage.getItem("myName"))
+
+
+localStorage.setItem("myAge", 27)
+
+let myAge = localStorage.getItem("myAge")
+console.log(+myAge)
+
+setData()
+
+readData()
\ No newline at end of file
diff --git a/main.js b/main.js
new file mode 100644
index 0000000..28f95e3
--- /dev/null
+++ b/main.js
@@ -0,0 +1,128 @@
+/*
+
+Quản lý student
+
+*/
+let countId = 0;
+
+let students = [
+    {
+        id: -2,
+        name: "Phước",
+        age: 35,
+        isInLove: false,
+        gender: "male",
+        dob: "1985-12-11"
+    },
+    {
+        id: -1,
+        name: "Hương",
+        age: 25,
+        isInLove: true,
+        gender: "female",
+        dob: "1895-11-05"
+    }
+]
+
+if(localStorage.getItem("students")) {
+    students = JSON.parse(localStorage.getItem("students"))
+}
+
+const tbodyEL = document.querySelector("tbody")
+const formEl = document.querySelector("form")
+
+let editStudent = null;
+
+function renderUi() {
+    localStorage.setItem("students", JSON.stringify(students))
+
+
+    let tbodyHtml = ``
+
+    students.forEach((value, key) => {
+        tbodyHtml += `
+            <tr>
+                <td>${key}</td>
+                <td>${value.id}</td>
+                <td>${value.name}</td>
+                <td>${value.age}</td>
+                <td>${value.isInLove ? "có" : "không"}</td>
+                <td>${value.gender}</td>
+                <td>${value.dob}</td>
+                <td>
+                    <button onclick="deleteStudent(${value.id})">xóa</button>
+                    <button onclick="setEditStudent(${value.id})">sửa</button>
+                </td>
+            </tr>  
+        `
+    })
+
+    tbodyEL.innerHTML = tbodyHtml
+
+    formEl.querySelector("#form_title").innerHTML = editStudent ? "Sửa sinh viên" : "Thêm Sinh Viên"
+
+    if (editStudent) {
+        formEl.querySelectorAll("input")[0].value = editStudent.name;
+        formEl.querySelectorAll("input")[1].value = editStudent.age;
+        formEl.querySelectorAll("input")[editStudent.isInLove ? 2 : 3].checked = true;
+
+        let options = formEl.querySelectorAll("option");
+
+        for (op of options) {
+            if (op.value == editStudent.gender) {
+                op.selected = true;
+                break
+            }
+        }
+
+        formEl.querySelectorAll("input")[4].value = editStudent.dob;
+
+    }
+
+}
+
+function save(event) {
+    event.preventDefault();
+    let form = event.target;
+
+    let newStudent = {
+        id: editStudent ? editStudent.id : countId++,
+        name: form.name.value,
+        age: form.age.value,
+        isInLove: form.isInLove.value,
+        gender: form.gender.value,
+        dob: form.dob.value
+    }
+
+    if (editStudent) {
+        for (let i = 0; i < students.length; i++) {
+            if (students[i].id == editStudent.id) {
+                students[i] = newStudent
+                break
+            }
+        }
+    } else {
+        students.push(newStudent)
+    }
+
+
+    renderUi()
+    formEl.reset()
+    editStudent = null;
+}
+
+function deleteStudent(stuId) {
+    if (confirm("xác nhận xóa!")) {
+        students = students.filter(stu => stu.id != stuId)
+    }
+
+    renderUi()
+}
+
+function setEditStudent(stuId) {
+    editStudent = students.find(stu => stu.id == stuId)
+
+    renderUi()
+}
+
+renderUi()
\ No newline at end of file
diff --git a/t.js b/t.js
new file mode 100644
index 0000000..2417e32
--- /dev/null
+++ b/t.js
@@ -0,0 +1,52 @@
+let employeeList = [
+    {
+        id: -1,
+        name: "Toàn",
+        age: 33,
+        gender: "male" // male, female, other
+    },
+    {
+        id: 1,
+        name: "Tiến",
+        age: 33,
+        gender: "male" // male, female, other
+    },
+    {
+        id: 2,
+        name: "Hải",
+        age: 33,
+        gender: "male" // male, female, other
+    }
+]
+
+
+
+function deleteItem(id) {
+    // for(let i = 0; i < employeeList.length; i++) {
+    //     if(id == employeeList[i].id) {
+    //         employeeList.splice(i, 1)
+    //         break
+    //     }
+    // }
+
+    employeeList = employeeList.filter(em => em.id != id)
+}
+
+function findById(id, arr) {
+    // for (let i = 0; i < arr.length; i++) {
+    //     if (id == arr[i].id) {
+    //         return arr[i]
+    //     }
+    // }
+
+    return arr.find(em => em.id == id)
+}
+
+
+let findEmp = findById(1, employeeList)
+
+findEmp.age = 18
+
+console.log("findEmp", findEmp)
+
+console.log("employeeList", employeeList)
\ No newline at end of file