浏览器本地存储localstorage,sessionStorage

2024-03-10 20:20

本文主要是介绍浏览器本地存储localstorage,sessionStorage,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

浏览器本地存储localstorage,sessionStorage

文章目录

  • 一、localstorage
    • localstorage存储
    • localstorage读取
    • localstorage删除
    • localstorage清空
  • 二、sessionStorage
    • localstorage读取
    • localstorage删除
    • localstorage清空
  • 总结


一、localstorage

即使浏览器关闭,本地回话存储还是会存在

localstorage存储

function saveData(){
localStorage.setItem( 'msg', 'hello!!!')
localStorage.setItem( 'msg2',666)
localStorage.setItem( 'person',JsON.stringify(p))
}

localstorage读取

localStorage.getItem('msg')
localStorage.getItem('msg2')
const result =  localStorage.getItem('person')
console.log(JSON.parse(result))

localstorage删除

localStorage.deleteItem('msg')

localstorage清空

localStorage.clear('msg')

二、sessionStorage

浏览器一关闭,则消失

function saveData(){
sessionStorage.setItem( 'msg', 'hello!!!')
sessionStorage.setItem( 'msg2',666)
sessionStorage.setItem( 'person',JsON.stringify(p))
}

localstorage读取

sessionStorage.getItem('msg')
sessionStorage.getItem('msg2')
const result =  sessionStorage.getItem('person')
console.log(JSON.parse(result))

localstorage删除

sessionStorage.deleteItem('msg')

localstorage清空

sessionStorage.clear('msg')

总结

1、localstorage,sessionStorage统称为WebStorage
2、存储内容大小一般为5MB左右,不同浏览器可能不一样
3、浏览器通过window.localstorage和window.sessionStorage的属性方法实现本地存储机制
4、如果对应获取不到属性值则返回null

这篇关于浏览器本地存储localstorage,sessionStorage的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/795400

相关文章

0基础租个硬件玩deepseek,蓝耘元生代智算云|本地部署DeepSeek R1模型的操作流程

《0基础租个硬件玩deepseek,蓝耘元生代智算云|本地部署DeepSeekR1模型的操作流程》DeepSeekR1模型凭借其强大的自然语言处理能力,在未来具有广阔的应用前景,有望在多个领域发... 目录0基础租个硬件玩deepseek,蓝耘元生代智算云|本地部署DeepSeek R1模型,3步搞定一个应

JavaWeb-WebSocket浏览器服务器双向通信方式

《JavaWeb-WebSocket浏览器服务器双向通信方式》文章介绍了WebSocket协议的工作原理和应用场景,包括与HTTP的对比,接着,详细介绍了如何在Java中使用WebSocket,包括配... 目录一、概述二、入门2.1 POM依赖2.2 编写配置类2.3 编写WebSocket服务2.4 浏

一文教你使用Python实现本地分页

《一文教你使用Python实现本地分页》这篇文章主要为大家详细介绍了Python如何实现本地分页的算法,主要针对二级数据结构,文中的示例代码简洁易懂,有需要的小伙伴可以了解下... 在项目开发的过程中,遇到分页的第一页就展示大量的数据,导致前端列表加载展示的速度慢,所以需要在本地加入分页处理,把所有数据先放

本地搭建DeepSeek-R1、WebUI的完整过程及访问

《本地搭建DeepSeek-R1、WebUI的完整过程及访问》:本文主要介绍本地搭建DeepSeek-R1、WebUI的完整过程及访问的相关资料,DeepSeek-R1是一个开源的人工智能平台,主... 目录背景       搭建准备基础概念搭建过程访问对话测试总结背景       最近几年,人工智能技术

如何在本地部署 DeepSeek Janus Pro 文生图大模型

《如何在本地部署DeepSeekJanusPro文生图大模型》DeepSeekJanusPro模型在本地成功部署,支持图片理解和文生图功能,通过Gradio界面进行交互,展示了其强大的多模态处... 目录什么是 Janus Pro1. 安装 conda2. 创建 python 虚拟环境3. 克隆 janus

Redis存储的列表分页和检索的实现方法

《Redis存储的列表分页和检索的实现方法》在Redis中,列表(List)是一种有序的数据结构,通常用于存储一系列元素,由于列表是有序的,可以通过索引来访问元素,因此可以很方便地实现分页和检索功能,... 目录一、Redis 列表的基本操作二、分页实现三、检索实现3.1 方法 1:客户端过滤3.2 方法

本地私有化部署DeepSeek模型的详细教程

《本地私有化部署DeepSeek模型的详细教程》DeepSeek模型是一种强大的语言模型,本地私有化部署可以让用户在自己的环境中安全、高效地使用该模型,避免数据传输到外部带来的安全风险,同时也能根据自... 目录一、引言二、环境准备(一)硬件要求(二)软件要求(三)创建虚拟环境三、安装依赖库四、获取 Dee

CSS自定义浏览器滚动条样式完整代码

《CSS自定义浏览器滚动条样式完整代码》:本文主要介绍了如何使用CSS自定义浏览器滚动条的样式,包括隐藏滚动条的角落、设置滚动条的基本样式、轨道样式和滑块样式,并提供了完整的CSS代码示例,通过这些技巧,你可以为你的网站添加个性化的滚动条样式,从而提升用户体验,详细内容请阅读本文,希望能对你有所帮助...

deepseek本地部署使用步骤详解

《deepseek本地部署使用步骤详解》DeepSeek是一个开源的深度学习模型,支持自然语言处理和推荐系统,本地部署步骤包括克隆仓库、创建虚拟环境、安装依赖、配置模型和数据、启动服务、调试与优化以及... 目录环境要求部署步骤1. 克隆 DeepSeek 仓库2. 创建虚拟环境3. 安装依赖4. 配置模型

DeepSeek模型本地部署的详细教程

《DeepSeek模型本地部署的详细教程》DeepSeek作为一款开源且性能强大的大语言模型,提供了灵活的本地部署方案,让用户能够在本地环境中高效运行模型,同时保护数据隐私,在本地成功部署DeepSe... 目录一、环境准备(一)硬件需求(二)软件依赖二、安装Ollama三、下载并部署DeepSeek模型选