讲师中心 微信公众号

工具推荐

视频效率加速
AniShort
AniShort

AI短剧协同制作平台

Seko
Seko

AI短剧一键生成成片

立刻MV
立刻MV

低成本歌曲 MV、视频生成

updream

一键生成高质量推广成片

JavaScript如何操作浏览器存储_JavaScript中LocalStorage和SessionStorage有什么区别

老雪吖_6415

老雪吖_6415

发布时间:2025-12-26 21:15:19

|

768人浏览过

|

来源于php中文网

原创

LocalStorage永久存储且同源共享,SessionStorage仅当前标签页会话有效并隔离;二者均需JSON序列化对象,容量约5–10MB,不参与HTTP请求。

javascript如何操作浏览器存储_javascript中localstorage和sessionstorage有什么区别

JavaScript 通过 LocalStorage 和 SessionStorage 提供了两种简单的客户端数据存储方式,它们都以键值对(key-value)形式保存字符串数据,但生命周期、作用域和使用场景有本质区别。

LocalStorage:长期保存,跨窗口共享

数据持久化保存在浏览器中,除非手动清除(如调用 localStorage.clear() 或用户清空缓存),否则一直存在,即使关闭标签页、重启浏览器甚至电脑也不会丢失。

  • 同一域名下所有标签页和窗口都能读写同一份数据(共享)
  • 适合存用户偏好设置、主题选择、登录态标识(注意:敏感信息如 token 不建议明文存这里)
  • 操作示例:
    localStorage.setItem('theme', 'dark');
    const theme = localStorage.getItem('theme');
    localStorage.removeItem('theme');

SessionStorage:仅限当前会话,页面级隔离

数据只在当前浏览器标签页(或窗口)的会话期间有效。关闭该标签页后,数据自动清除;新开一个同域名标签页,SessionStorage 是完全独立的,不共享。

HISUI 前端框架开发指南(IRIS版)
HISUI 前端框架开发指南(IRIS版)

HISUI 前端框架基础开发指南。HISUI 是基于 easyui 二次开发的 jQuery UI 组件库,专为医疗信息系统设计。当涉及 HISUI 组件开发、jQuery easyui 表格/表单/布局/窗口、医疗系统前端页面编写时使用此 skill。 涵盖 40 个组件的官方文档参考,支持声明式与编程式两种初始化方式,提供 $cm/$m 数据访问方法。

下载
  • 适合临时状态,比如表单草稿、多步骤流程中的中间数据、防重复提交的标记
  • 刷新页面不会丢失数据(仍在同一会话内)
  • 操作方式与 LocalStorage 完全一致,只是把 localStorage 换成 sessionStorage

关键区别对比

注意:两者都不支持直接存对象或数组,必须先用 JSON.stringify() 转为字符串,读取时再用 JSON.parse() 还原。

立即学习“Java免费学习笔记(深入)”;

  • 有效期:LocalStorage 永久(直到清除);SessionStorage 仅当前标签页生命周期
  • 作用域:LocalStorage 同源下所有标签页共享;SessionStorage 每个标签页独立
  • 容量限制:通常都是 5–10MB(具体取决于浏览器),远大于 Cookie 的 4KB
  • 是否随 HTTP 请求发送:都不参与网络请求,纯前端存储,不影响性能

使用小提醒

  • 存取前建议加 try-catch,防止因存储满或禁用导致报错
  • 不要存敏感信息(如密码、完整 token),它们可被同源 JS 任意读取
  • LocalStorage 修改会触发同源其他窗口的 storage 事件,可用于跨标签页通信;SessionStorage 不触发
  • 判断是否可用:可尝试写入再读取,或检查 typeof localStorage !== 'undefined'

热门AI工具

更多
Laper
Laper Hot

Laper是专为编剧、导演和制片人推出的 AI 原生剧本创作工具。

函子Zion

一款支持AI搭建、可视化编辑和多端发布的全栈无代码开发平台。

小橡皮AI

一款AI工具,主要用于小橡皮一键去AI味,将机器味重的内容改得更有活人感,防止因为 AI 内容被平台打上 AI 标签,以及限流,适合需要提升相关任务效率的用户。

SoundView
SoundView Hot

SoundView是一款面向跨境电商的视频翻译、配音和本地化 AI 创作平台。

PixPix
PixPix Hot

PixPix是一款面向电商视觉生产的AI商品图生成工具。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

Lovart
Lovart Hot

一款面向视觉设计创作的AI设计平台,可通过智能体和画布工作流辅助制作海报、Logo、网页、PPT及其他视觉内容。

相关专题

更多
json数据格式
json数据格式

JSON是一种轻量级的数据交换格式。本专题为大家带来json数据格式相关文章,帮助大家解决问题。

2335

2023.08.07

json是什么
json是什么

JSON是一种轻量级的数据交换格式,具有简洁、易读、跨平台和语言的特点,JSON数据是通过键值对的方式进行组织,其中键是字符串,值可以是字符串、数值、布尔值、数组、对象或者null,在Web开发、数据交换和配置文件等方面得到广泛应用。本专题为大家提供json相关的文章、下载、课程内容,供大家免费下载体验。

3842

2023.08.23

jquery怎么操作json
jquery怎么操作json

操作的方法有:1、“$.parseJSON(jsonString)”2、“$.getJSON(url, data, success)”;3、“$.each(obj, callback)”;4、“$.ajax()”。更多jquery怎么操作json的详细内容,可以访问本专题下面的文章。

1276

2023.10.13

go语言处理json数据方法
go语言处理json数据方法

本专题整合了go语言中处理json数据方法,阅读专题下面的文章了解更多详细内容。

4459

2025.09.10

cookie
cookie

Cookie 是一种在用户计算机上存储小型文本文件的技术,用于在用户与网站进行交互时收集和存储有关用户的信息。当用户访问一个网站时,网站会将一个包含特定信息的 Cookie 文件发送到用户的浏览器,浏览器会将该 Cookie 存储在用户的计算机上。之后,当用户再次访问该网站时,浏览器会向服务器发送 Cookie,服务器可以根据 Cookie 中的信息来识别用户、跟踪用户行为等。

12919

2023.06.30

document.cookie获取不到怎么解决
document.cookie获取不到怎么解决

document.cookie获取不到的解决办法:1、浏览器的隐私设置;2、Same-origin policy;3、HTTPOnly Cookie;4、JavaScript代码错误;5、Cookie不存在或过期等等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

1346

2023.11.23

阻止所有cookie什么意思
阻止所有cookie什么意思

阻止所有cookie意味着在浏览器中禁止接受和存储网站发送的cookie。阻止所有cookie可能会影响许多网站的使用体验,因为许多网站使用cookie来提供个性化服务、存储用户信息或跟踪用户行为。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

884

2024.02.23

cookie与session的区别
cookie与session的区别

本专题整合了cookie与session的区别和使用方法等相关内容,阅读专题下面的文章了解更详细的内容。

1986

2025.08.19

Go-Zero API开发使用教程
Go-Zero API开发使用教程

本专题聚焦Go-Zero的API开发,拆解.api描述文件的语法结构、路由与分组定义、参数绑定与校验规则,说明统一响应体、JWT鉴权、跨域与接口文档生成的落地方式,并给出网关聚合与接口测试的实践建议。

20

2026.11.12

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
WebStorm 官方调试文档
WebStorm 官方调试文档

共0课时 | 0人学习

React 教程
React 教程

共58课时 | 12.5万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 6.8万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn