sessionStorage 使用方法
作为html5中Web Storage的一种存储方式，localStorage和sessionStorage一样都是用来存储客户端临时信息的对象。
W3c上给的介绍是这两者区别在于前者用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。而sessionStorage存储的数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。个人的理解是你在打开一个页面时记录sessionStorage,当你把页面或者浏览器关闭时session中的数据即销毁。
接下来是测试。
先创建一个index.html，代码：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="button" value="Login" onclick="submit()" />
<input type="text" name="text" id="text" />
<input type="button" value="show" onclick="show()" />
<a href="33.html" target="_blank">33.html</a>
</body>
<script>
function submit() {
var str = document.getElementById("text").value.trim();
setInfo(str);
document.getElementById("text").value = "";
}
//储存数据
function setInfo(name) {
var storage = window.sessionStorage;
storage.setItem('name', name);
}
//显示数据
function show() {
var storage = window.sessionStorage;
var str = "your name is " + storage.getItem("name");
document.getElementById("text").value = str;
}
</script>
</html>
先点击show按钮，在文本框出现的是“your name is null”，之后只需在文本框中输入数据再点击login按钮就能把数据存储到sessionStorage。如图
现在点击show 文本框就显示“your name is xiaoming”。
然后再创建一个33.html，代码：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
var str = window.sessionStorage;
alert(str.getItem("name"));
</script>
</head>
<body>
</body>
</html>
最后只要点击index.html的33.html跳转到该页面就能发现sessionstorage内数据是共享的。
sessionStorage 使用方法的更多相关文章
- JQuery和JS操作LocalStorage/SessionStorage的方法
LocalStorage 是对Cookie的优化 没有时间限制的数据存储 在隐私模式下不可读取 大小限制在500万字符左右,各个浏览器不一致 在所有同源窗口中都是共享的 本质是在读写文件,数据多的话会 ...
- JQuery和JS操作LocalStorage/SessionStorage的方法（转）
出处:http://blog.csdn.net/djzhao627/article/details/50747628 首先说一下LocalStorage和SessionStorage LocalSto ...
- localStorage，sessionStorage的方法重写
本文是针对于localStorage,sessionStorage对于object,string,number,bollean类型的存取方法 我们知道,在布尔类型的值localStorage保存到本地 ...
- sessionStorage和localStorage的使用方法
1.sessionStorage sessionStorage生命周期为当前窗口或标签页,一旦窗口或标签页被永久关闭了,那么所有通过sessionStorage存储的数据也就被清空 JSON.pars ...
- HTMl5的存储方式sessionStorage和localStorage详解
html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage.sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有 ...
- html5 sessionStorage 与 localStorage存储
sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁.因此sessionStorage不是一种持久化的本地 ...
- HTMl5的sessionStorage和localStorage
HTMl5的sessionStorage和localStorage html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. sessionSt ...
- HTML5中的sessionStorage和localStorage
html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. sessionStorage用于本地存储一个会话(session)中的数据,这些数据只 ...
- js通过sessionStorage实现的返回上一页
通常,我们都会使用比较熟悉的javascript:history.go(-1)来实现返回上一页,此种方法有一个问题就是返回上一页后不能刷新当前页面,给我们的开发带来了一定的不便,显然有时这种方法就不是 ...
随机推荐
- [SDOI2011]消防（贪心，图论，树的直径）
[SDOI2011]消防 题目描述 某个国家有n个城市,这n个城市中任意两个都连通且有唯一一条路径,每条连通两个城市的道路的长度为zi(zi<=1000). 这个国家的人对火焰有超越宇宙的热情, ...
- uboot移植之迷雾解码
按照蜗窝科技的步骤执行 一.有关硬件描述的填空题 1)CPU上电后,从哪种设备( BOOTROM )的哪个地址( 0x0000_0000 )开始执 ...
- [web 安全]逻辑漏洞之密码重置
原文:http://wooyun.jozxing.cc/static/drops/web-5048.html 密码找回逻辑一.用户凭证(密码找回的凭证太弱,暴力破解)1.当当网任意用户密码修改漏洞(h ...
- 【leetcode】1079. Letter Tile Possibilities
题目如下: You have a set of tiles, where each tile has one letter tiles[i]printed on it. Return the num ...
- Python实例教程
转自:http://codingdict.com/article/9026 Python 100例-01 题目: 输有1.2.3.4个数字,能组成多少个互不相同且无重复数字的三位数? Python 1 ...
- ubuntu + JetSonNano+OpenCV3.4.8
首先强调一点,如果要配置darknet环境,不建议安装该版本!!! 安装opencv前,建议先检测自己的系统是否已经装过其他版本, 检查方式: (1)查看是否安装opencv库: pkg-config ...
- Dubbo学习-4-dubbo简单案例-2-服务提供者和消费者配置
在上一篇帖子的基础上,开始使用dubbo来实现RPC调用: 根据dubbo的架构图可知,需要做以下几件事情: 1.将服务提供者注册到注册中心(暴露服务) (1)引入dubbo依赖, 这里依赖2.6.2 ...
- kibana使用日志时间进行排序
kibana默认的是按照客户端的采集时间(@timestamp)进行排序,这往往不是我们所需要的,我们需要的是对日志实际时间进行排序,要解决这个问题,有很多种方法,可以在elasticsearch建立 ...
- 【HDOJ6627】equation（模拟）
题意:给定n,整数序列a和b,整数C,求所有成立的x n<=1e5,1<=a[i]<=1e3,-1e3<=b[i]<=1e3,1<=C<=1e9 思路: 大概 ...
- 20180708-Java基本数据类型
public class PrimitiveTypeTest{ public static void main(String[] args){ //byte System.out.println(&q ...