源码可以到GitHub上下载!
sessionStorage:
  关闭浏览器再打开将不保存数据
 
  复制标签页会连同sessionStorage数据一同复制
  复制链接地址打开网页不会复制seessionStorage内的数据
 
  清除缓存加载当前页对页面无影响
    1) 同源策略限制。若想在不同页面之间对同一个sessionStorage进行操作,这些页面必须在同一协议、同一主机名和同一端口下。(IE 8和9存储数据仅基于同一主机名,忽略协议(HTTP和HTTPS)和端口号的要求)
    2) 单标签页限制。sessionStorage操作限制在单个标签页中,在此标签页进行同源页面访问都可以共享sessionStorage数据。
    3) 只在本地存储。seesionStorage的数据不会跟随HTTP请求一起发送到服务器,只会在本地生效,并在关闭标签页后清除数据。(若使用Chrome的恢复标签页功能,seesionStorage的数据也会恢复)。
    4) 存储方式。seesionStorage的存储方式采用key、value的方式。value的值必须为字符串类型(传入非字符串,也会在存储时转换为字符串。true值会转换为"true")。
    5) 存储上限限制:不同的浏览器存储的上限也不一样,但大多数浏览器把上限限制在5MB以下。
  可访问 http://dev-test.nemikor.com/web-storage/support-test/ 测试浏览器的存储上限。
  1. // sessionStorage使用示例
  2. var username = document.getElementById("username"); // 获取input username
  3. var userpwd = document.getElementById("userpassword"); // 获取input userpassword
  4. var remember = document.getElementById("remember"); // 获取记住账号密码
  5. // 点击复选框记住 账号、密码、复选框
  6. function rememberValue() {
  7. if (remember.checked == true) {
  8. sessionStorage.setItem('user', username.value);
  9. sessionStorage.setItem('pwd', userpwd.value);
  10. sessionStorage.setItem('remember', remember.checked);
  11. } else {
  12. sessionStorage.removeItem("user");
  13. sessionStorage.removeItem("pwd");
  14. sessionStorage.removeItem("remember");
  15. // sessionStorage.clear();// 全部删除
  16. }
  17. }
  18. // 页面加载完毕后从sessionStorage里读取值并填入相应的标签内
  19. window.onload = function () {
  20. username.value = sessionStorage.getItem("user");
  21. userpwd.value = sessionStorage.getItem("pwd");
  22. remember.checked = sessionStorage.getItem("remember");
  23. }

本地存储之sessionStorage的更多相关文章

  1. 关于HTML5本地缓存技术LocalStorage 本地存储 和 SessionStorage

    如果你想在用户访问的时候记录或者记住他们的行为,你会想到的是什么,cookie 和session.但今天告诉你还有两种或者说是1种吧 那就是html5的 LocalStorage 本地存储和 Sess ...

  2. 【转】本地存储-localStroage/sessionStorage存储

    原文地址:[js学习笔记-103]----本地存储-localStroage/sessionStorage存储 客户端存储 l  WEB存储 web存储最初作为html5的一部分被定义成API形式,但 ...

  3. 移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题

    移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题 开发H5 webapp时经常需要使用本地存储,如localStorage和sessionStor ...

  4. 本地存储localStorage sessionStorage 以及 session 和cookie的对比和使用

    cookie和session都是用来跟踪浏览器用户身份的会话方式. 1.验证当前服务中继续请求数据时,哪些缓存数据会随着发往服务器? 只有cookie中设置的缓存数据会发送到服务器端 2. 强调几点: ...

  5. JS操作cookie以及本地存储(sessionStorage 和 localStorage )

    JS操作cookie cookie的操作用两种方式 1.substring //创建cookie function setCookie(name,value,expires,path,domain,s ...

  6. 本地存储 localStorage/sessionStorage/cookie

    cookie是个基础的东西.是服务器发送到客户端,存储在客户端的一小段数据.可以存储一些配置信息,客户标识信息等.用户下次访问这个网站时,会把上次网站发来的cookie一同发送回去.cookie保存在 ...

  7. sessionStorage html5客户端本地存储之sessionStorage及storage事件

    可以看一下<JavaScript本地存储实践(html5的localStorage和ie的userData)>sessionStorage和上文中提到的localStorage非常相识,方 ...

  8. html5客户端本地存储之sessionStorage及storage事件

    首先您可以看一下<JavaScript本地存储实践(html5的localStorage和ie的userData)>sessionStorage和上文中提到的localStorage非常相 ...

  9. HTML5本地存储应用sessionStorage和localStorage

    在html5之前,浏览器要实现数据的存储,一般都是用cookie,但是cookie有域名和大小限定. html5流行之后,可以通过localStorage和sessionStorage实现浏览器端的数 ...

随机推荐

  1. ASP.NET MVC下使用AngularJs语言(六):获取下拉列表的value和Text

    前面Insus.NET有在Angularjs实现DropDownList的下拉列表的功能.但是没有实现怎样获取下拉列表的value和text功能. 下面分别使用ng-click和ng-change来实 ...

  2. Eclipse 工作空间的相关说明

    工作空间文件说明 当eclipse选定一个文件夹作为workspace工作空间时,就会在该目录中生成一些文件. 共三个文件夹:.metadata ..recommenders .RemoteSyste ...

  3. Shell-6--预定义变量

  4. location匹配

    =/ 表示精确匹配  www.sensetime.com/ ~ :表示做正则表达式匹配,区分字符大小写 ~* : 表示做正则表达式匹配,不区分大小写 ^~: URI的左半部分匹配,不区分大小写 匹配优 ...

  5. 京东架构师的showtime京东个性化推荐系统实战

    推荐系统核心任务是排序,从线上服务角度看,就是将数据从给定集合中数据选择出来,选出后根据一定规则策略方法进行排序. 线上服务要根据一定规则进行架构设计,架构设计是什么?每一次权衡取舍都是设计,设计需要 ...

  6. LDA-线性判别分析(四)其他几个相关问题

    本来是要调研 Latent Dirichlet Allocation 的那个 LDA 的, 没想到查到很多关于 Linear Discriminant Analysis 这个 LDA 的资料.初步看了 ...

  7. 课程三(Structuring Machine Learning Projects),第二周(ML strategy(2)) —— 1.Machine learning Flight simulator:Autonomous driving (case study)

    [中文翻译] 为了帮助您练习机器学习的策略, 在本周我们将介绍另一个场景, 并询问您将如何行动.我们认为, 这个工作在一个机器学习项目的 "模拟器" 将给一个任务, 告诉你一个机器 ...

  8. hive中的子查询改join操作(转)

    这些子查询在oracle和mysql等数据库中都能执行,但是在hive中却不支持,但是我们可以把这些查询语句改为join操作: -- 1.子查询 select * from A a where a.u ...

  9. logrotate实现Mysql慢日志分割

    MySQL慢日志? MySQL的慢查询日志是MySQL提供的一种日志记录,它用来记录在MySQL中响应时间超过阀值的语句,具体指运行时间超过long_query_time值的SQL,则会被记录到慢查询 ...

  10. linux arm 交叉编译ACE(ubuntu16.04)

    解压ace包 tar zxvf ACE_6.1.0.tar.gz 在终端设置环境变量 sudo gedit /etc/profile 在打开的内容添加 export ACE_ROOT=/home/xx ...