|
|
@@ -0,0 +1,44 @@
|
|
|
+<!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>
|
|
|
+ <script>
|
|
|
+ // 本地存储 localStorage sessionStorage
|
|
|
+ // localStorage 本地存储 永久存储 除非手动删除 否则会一直存在
|
|
|
+ // sessionStorage 会话存储 会话结束后会自动删除
|
|
|
+ // localStorage sessionStorage 使用场景
|
|
|
+ // localStorage 存储用户偏好
|
|
|
+ // sessionStorage 存储用户登录信息 用户名 密码 手机号 邮箱 等
|
|
|
+ // 存储数据
|
|
|
+ localStorage.setItem("username","张三");
|
|
|
+ sessionStorage.setItem("userphone","13800000000");
|
|
|
+ // 获取数据
|
|
|
+ var username = localStorage.getItem("username");
|
|
|
+ console.log(username);
|
|
|
+ var userphone = sessionStorage.getItem("userphone");
|
|
|
+ console.log(userphone);
|
|
|
+ // 删除数据 可以删除指定的数据
|
|
|
+ // localStorage.removeItem("username");
|
|
|
+ // sessionStorage.removeItem("userphone");
|
|
|
+ // 清空数据 一次性全部清空
|
|
|
+ // localStorage.clear();
|
|
|
+ // sessionStorage.clear();
|
|
|
+
|
|
|
+
|
|
|
+ // 注意事项
|
|
|
+ // localStorage sessionStorage 只能存储字符串类型的数据
|
|
|
+ // localStorage sessionStorage 与 cookie 区别
|
|
|
+ // localStorage sessionStorage 存储数据大小 5MB 及以上
|
|
|
+ // cookie 存储数据大小 4KB 左右
|
|
|
+ // cookie 会自动过期 可以设置过期时间 过期后会自动删除
|
|
|
+ // localStorage 没有过期时期 除非手动删除 否则会一直存在
|
|
|
+ // sessionStorage 会话存储 会话结束后会自动删除 比如关闭浏览器数据就消失
|
|
|
+ // cookie 会随着请求发送到服务器 可以用于存储用户登录信息
|
|
|
+ // localStorage sessionStorage 不会随着请求发送到服务器
|
|
|
+ </script>
|
|
|
+</body>
|
|
|
+</html>
|
