sessionStorage用法

Elon_王艺龙

已于 2022-12-20 20:10:43 修改

阅读量1.1k

点赞数

文章标签：前端 javascript 开发语言

于 2022-12-13 08:55:15 首次发布

本文链接：https://blog.csdn.net/Yilong18/article/details/128291629

版权

仅在当前会话下有效，关闭页面或者浏览器后被清除；

sessionStorage存放数据大小一般为5-8MB；

仅在浏览器中保存，不参与服务器通信；

可以接受源生接口，亦可以再次封装来对Object和Array有更好的支持；

API调用：

sessionStorage.setItem("key","value");//以“key”为名称存储一个值“value”
 
sessionStorage.getItem("key");//获取名称为“key”的值
 
sessionStorage.removeItem("key");//删除名称为“key”的信息。
 
sessionStorage.clear();//清空sessionStorage中所有信息

localStorage存储的数据为持久数据,而sessionStorage当你关闭浏览器的时候数据就没了

sessionStorage的有效期是和存储数据脚本所在的最顶层的窗口或者是浏览器标签是一样的，一旦窗口或者标签页被永久关闭了，存储的数据也就失效了。

这是一个小demo:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    	<meta charset="UTF-8">
    	<title>浏览器存储数据</title>
    </head>
    <body>
    	
    </body>
    <script type="text/javascript" src="tools/jquery-2.1.4.min.js"></script>
    <script type="text/javascript">
    	var data={
    		a:"111",
    		b:"2222"
    	}
    	var data1=[{name:"zsh",age:"12"},
    	{name:"zzz",age:"23"},
    	{name:"wer",age:"67"}];
    	// 存储值：将对象转换为Json字符串
    	sessionStorage.setItem("user", JSON.stringify(data));
    	sessionStorage.setItem("user1", JSON.stringify(data1));
    	// 取值时：把获取到的Json字符串转换回对象
    	var getdata = JSON.parse(sessionStorage.getItem("user"));
    	var getdata1 = JSON.parse(sessionStorage.getItem("user1"));
    	console.log(getdata);     //{a: "111", b: "2222"}
    	console.log(getdata1);    //返回数组
    	sessionStorage.clear();
    	var getdata2 = JSON.parse(sessionStorage.getItem("user1"));
    	console.log(getdata2);    //null
    </script>
    </html>

运行结果：