From f6cd81e2a2555fe76e2ba6eda486b138c32d534b Mon Sep 17 00:00:00 2001
From: roger <roger_sun@outlook.com>
Date: Fri, 20 Jan 2023 16:24:04 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AD=A6=E4=B9=A0localStorage=E5=92=8CsessionS?=
 =?UTF-8?q?torage?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../localStorage.html                         | 34 +++++++++++++++++++
 .../sessionStorage.html                       | 34 +++++++++++++++++++
 2 files changed, 68 insertions(+)
 create mode 100644 20_脚手架/vue_code/08.浏览器本地存储/localStorage.html
 create mode 100644 20_脚手架/vue_code/08.浏览器本地存储/sessionStorage.html
diff --git a/20_脚手架/vue_code/08.浏览器本地存储/localStorage.html b/20_脚手架/vue_code/08.浏览器本地存储/localStorage.html
new file mode 100644
index 0000000..337aed3
--- /dev/null
+++ b/20_脚手架/vue_code/08.浏览器本地存储/localStorage.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>localStorage</title>
+</head>
+<body>
+    <h2>localStorage</h2>
+    <button onclick="saveData()">点击保存一个数据</button><br/>
+    <button onclick="readData()">点击读取一个数据</button><br/>
+    <button onclick="deleteData()">点击删除一个数据</button><br/>
+    <button onclick="deleteAllData()">点击清空数据</button><br/>
+    <script type="text/javascript">
+        let p = {name:'测试' , age:18}
+        function saveData() {
+            localStorage.setItem('msg', 'Hello!!')
+            localStorage.setItem('msg2', 666)
+            localStorage.setItem('person', JSON.stringify(p))
+        }
+        function readData() {
+            console.log(localStorage.getItem('msg'))
+            console.log(localStorage.getItem('msg2'))
+            console.log(JSON.parse(localStorage.getItem('person')))
+            console.log(localStorage.getItem('msg3'))
+        }
+        function deleteData() {
+            localStorage.removeItem('msg')
+        }
+        function deleteAllData() {
+            localStorage.clear()
+        }
+    </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/20_脚手架/vue_code/08.浏览器本地存储/sessionStorage.html b/20_脚手架/vue_code/08.浏览器本地存储/sessionStorage.html
new file mode 100644
index 0000000..f29b23b
--- /dev/null
+++ b/20_脚手架/vue_code/08.浏览器本地存储/sessionStorage.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>sessionStorage</title>
+</head>
+<body>
+<h2>sessionStorage</h2>
+<button onclick="saveData()">点击保存一个数据</button><br/>
+<button onclick="readData()">点击读取一个数据</button><br/>
+<button onclick="deleteData()">点击删除一个数据</button><br/>
+<button onclick="deleteAllData()">点击清空数据</button><br/>
+<script type="text/javascript">
+    let p = {name:'测试' , age:18}
+    function saveData() {
+        sessionStorage.setItem('msg', 'Hello!!')
+        sessionStorage.setItem('msg2', 666)
+        sessionStorage.setItem('person', JSON.stringify(p))
+    }
+    function readData() {
+        console.log(sessionStorage.getItem('msg'))
+        console.log(sessionStorage.getItem('msg2'))
+        console.log(JSON.parse(sessionStorage.getItem('person')))
+        console.log(sessionStorage.getItem('msg3'))
+    }
+    function deleteData() {
+        sessionStorage.removeItem('msg')
+    }
+    function deleteAllData() {
+        sessionStorage.clear()
+    }
+</script>
+</body>
+</html>
\ No newline at end of file
