H5的本地保存localStorage、sessionStorage用法总结

2024-05-26 16:39:01

localStorage: 方法存储的数据没有时间限制。

sessionStorage: 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后，数据会被删除。

localStorage、和sessionStorage的用法:（localStorage和sessionStorage都具有相同的操作方法，例如setItem、getItem、removeItem、clear。下面以localStorage举例）

（1） setItem 存储 value

.setItem( key, value) 将value存储到key字段。
例：localStorage.setItem("job", "basketballplayer")。

（2） setItem 存储 json对象

localStorage 和 sessionStorage也可存储Json对象，存储时，通过JSON.stringify()将对象转换为文本格式；读取时，通过JSON.parse()将文本转换回对象。

 var user = ｛name:"james", job:"basketballplayer" ｝// 存储值：将对象转换为Json字符串

localStorage.setItem('user', JSON.stringify(user));// 取值时：把获取到的Json字符串转换回对象var userJsonStr = localStorage.getItem('user');var userEntity = JSON.parse(userJsonStr);console.log(userEntity.name); // => james

（3） getItem获取value

.getItem(key) 获取指定key本地存储的值。
例：localStorage.getItem("job")。

（4）removeItem删除key

.removeItem(key)删除指定key本地存储的值。
例：localStorage.removeItem("job");

（5）clear清除所有的key/value

.clear() 清除所有的key/value
例：localStorage.clear();

转载于:https://www.cnblogs.com/wlzdf999/p/9359142.html

H5的本地保存localStorage、sessionStorage用法总结相关推荐

本地储存 localstorage sessionstorage 的兼容性，API，特点
在开发中发现cookie储存会在http请求头中,大大影响了数据请求交互. 现在h5中提供了新的解决方式(API) 存储方式: 1.本地储存 localstorage & sessionsto ...
移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题
2019独角兽企业重金招聘Python工程师标准>>> 开发H5 webapp时经常需要使用本地存储,如localStorage和sessionStorage存储一些数据,相比最多能 ...
本地存储localStorage的用法总结
一.什么是localStorage? 在HTML5中,新加入了一个localStorage特性,这个特性主要是用来作为本地存储来使用的,解决了cookie存储空间不足的问题(cookie中每条cook ...
localStorage sessionStorage 和cookie等前端存储方式总结
localStorage sessionStorage 和cookie localStorage localStorage是本地存储的,除非清空本地数据 localStorage不会自动把数据发给服务 ...
h5新增浏览器本地缓存localStorage
h5新增属性学习笔记(非原创) html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. sessionStorage用于本地存储一个会话(se ...
sessionStorage和localStorage的用法，不同点和相同点
一,共同点 (1)存储时用setItem: localStorage.setItem("key","value");//以"key"为名称存 ...
用html2canvas长按保存h5页面,html2canvas - 微信中长按存图 - 将h5活动结果保存到本地...
现在有很多在微信里流行的h5活动页.这些小h5大部分都是简单的交互然后得出一个abcd早就拟定好的结果,根据你的选项分几种情况,最终得到其中一个作为你测试的答案.比如这个就是最后那张结果图: 当时自己 ...
本地存储-cookie|localStorage|sessionStorage|indexedDB
本地存储本地存储 cookie 如何工作问题 cookie标准限制属性 expires|max-age domain&path secure HttpOnly 设置cookie 服务端设 ...
客户端 localStorage, sessionStorage, cookie 的区别
SessionStorage, LocalStorage, Cookie这三者都可以被用来在浏览器端存储数据,而且都是字符串类型的键值对! 区别在于前两者属于WebStorage,创建它们的目的便是存 ...

最新文章

热门文章