LocalStorage用于长期存储，关闭浏览器仍保留；SessionStorage仅限当前标签页，关闭即清除；二者均遵循同源策略，仅支持字符串，容量约5–10MB。
JavaScript操作浏览器存储，主要靠 LocalStorage 和 SessionStorage 两个 Web Storage API。它们都以键值对（key-value）形式保存字符串数据，用法相似，但生命周期和作用域不同——选哪个，关键看你要存的数据“活多久”“在哪儿用”。
LocalStorage：关掉浏览器也不丢，适合长期缓存
LocalStorage 的数据会一直保留在用户设备上，除非手动清除（比如调用 localStorage.clear() 或用户在浏览器设置里删除），即使关闭标签页、重启浏览器甚至电脑，数据依然存在。
- 适用场景：用户偏好设置（如主题色、语言）、登录态标识（配合后端 token 验证）、离线内容缓存（如文章草稿、商品列表）
- 注意：不能存敏感信息（如密码、完整 token），因为它是纯前端可读的，且无自动过期机制
- 基本操作示例：
localStorage.setItem('theme', 'dark');const theme = localStorage.getItem('theme');localStorage.removeItem('theme');
SessionStorage：只活在当前标签页，关了就清空
SessionStorage 的数据仅在当前浏览器标签页（或窗口）中有效，页面刷新不丢失，但一旦关闭该标签页，所有数据自动销毁。同一域名下的不同标签页之间互不共享。
- 适用场景：表单临时数据（如多步填写未提交的订单信息）、一次性验证码、页面内状态快照（如筛选条件暂存）
- 优势：天然隔离，避免跨标签页干扰；安全性略高于 LocalStorage（生命周期短，攻击窗口小）
- 基本操作与 LocalStorage 完全一致，只是把
localStorage换成sessionStorage
别只看“存多久”，还要看“谁能看到”
两者都遵循同源策略（same-origin policy），即只有相同协议、域名、端口的脚本才能访问对应存储。但要注意：
立即学习“Java免费学习笔记（深入）”；
- HTTP 和 HTTPS 视为不同源，数据不互通
- 子域名间默认不共享（
shop.example.com和blog.example.com无法互相读取） - 如果需要跨子域名共享，需配合
document.domain（已逐步被弃用）或后端接口中转
容量和兼容性：够用，但别当数据库用
大多数浏览器给每个源分配约 5–10MB 存储空间（远大于 Cookie 的 4KB），支持 IE8+、所有现代浏览器。不过它只支持字符串值：
- 存对象？先
JSON.stringify()；取出来再JSON.parse() - 频繁读写大量数据会影响性能，不适合替代 IndexedDB 做复杂结构化存储
- 没有监听变更的原生事件（可用
storage事件监听同源其他标签页的修改，但当前页修改不会触发自身）
不复杂但容易忽略：选 LocalStorage 还是 SessionStorage，本质是在问——这个数据，用户下次打开网页时还需要吗？需要，就 Local；只服务于这一次交互，就 Session。
