前端存储机制 session、localStorage 使用方法

session

session会话：浏览器从打开某个网页的一个页面开始，直至关闭浏览器，整个过程称为“浏览器与WEB服务器的一次会话”

作用：在同一个会话中所有页面之间共享数据

使用：

sessionStorage[key]=val; 	//保存一个数据
sessionStorage.setitem(key,val); 	//保存一个数据
var val = sessionStorage['key']; 	//读取一个数据
var val = sessionStorage.getitem('key'); 	//读取一个数据
sessionStorage.removeltem('key'); 	//删除一个数据
sessionStorage.length; 	 	//数据个数
sessionStorage.key(i); 	//获取第i个key

 

localStorage

本地存储对象（跨会话及存储）

在磁盘中存储用户数据，可供此次会话和后续会话的页面共同使用；即使浏览器关闭了也不会消失

使用：

localStorage[key]=val; 	//保存一个数据
localStorage.setitem(key,val); 	//保存一个数据
var val = localStorage['key']; 	//读取一个数据
var val= localStorage.getitem('key'); 	//读取一个数据
localStorage.removeltem('key'); 	//删除一个数据
localStorage.length; 	 	//数据个数
localStorage.key(i); 	//获取第i个key

注意：

localStorage中若数据发生了修改，会触发事件window.onstorage事件，可以监听事件，实现监视localstorage数据改变目的，不能监视sessionStorage数据修改；

 

此外：欢迎各位学生、前端新人、大牛们加入Q群分享交流学习和工作中的问题，qq群：607864309；该群保证没有广告，不推荐课程，单纯的技术交流