源码可以到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/ 测试浏览器的存储上限。
         // sessionStorage使用示例
var username = document.getElementById("username"); // 获取input username
var userpwd = document.getElementById("userpassword"); // 获取input userpassword
var remember = document.getElementById("remember"); // 获取记住账号密码
// 点击复选框记住 账号、密码、复选框
function rememberValue() {
if (remember.checked == true) {
sessionStorage.setItem('user', username.value);
sessionStorage.setItem('pwd', userpwd.value);
sessionStorage.setItem('remember', remember.checked);
} else {
sessionStorage.removeItem("user");
sessionStorage.removeItem("pwd");
sessionStorage.removeItem("remember");
// sessionStorage.clear();// 全部删除
}
}
// 页面加载完毕后从sessionStorage里读取值并填入相应的标签内
window.onload = function () {
username.value = sessionStorage.getItem("user");
userpwd.value = sessionStorage.getItem("pwd");
remember.checked = sessionStorage.getItem("remember");
}

本地存储之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. FFmpeg原始帧处理-滤镜API用法详解

    本文为作者原创,转载请注明出处:https://www.cnblogs.com/leisure_chn/p/10429145.html 在FFmpeg中,滤镜(filter)处理的是未压缩的原始音视频 ...

  2. Jira/Confluence的备份、恢复和迁移

    之前的文章已经分别详细介绍了Jira.Confluence的安装及二者账号对接的操作方法,下面简单说下二者的备份.恢复和迁移: 一.Jira.Confluence的备份.恢复1)Confluence的 ...

  3. 再次理解HTTP请求过程[概念原理篇]

    我曾多次阅读http协议,但是理解依然不深,在此,再次阅读,再次理解.加深两点:解析头部信息\r\n,分解头部和主体用\r\n\r\n.之所以一次请求会看到网络里有很多请求,是因为浏览器代替访问了多次 ...

  4. Nginx---(Server虚拟主机)

    server{ listen PORT; server_name NAME; root /PATH: } 基于端口 listen指令监听在不同的端口; 基于IP 基于FQDN (域名,主机名) ser ...

  5. postgres Date/Time 学习笔记

    一.Date/Time Types 参考文档:https://www.postgresql.org/docs/9.2/static/datatype-datetime.html Types 别名 ti ...

  6. axios的Get和Post方法封装及Node后端接收数据

    最近有做一个Vue的小项目,其中用到了尤大大推荐使用的axios,但是使用的过程中遇到了各种各样的问题,所以这次也是将一些心得分享出来. 安装的流程我就简单说一下下吧,在一个自己新建的文件夹中命令行中 ...

  7. ASP.NET MVC 异常Exception拦截

    一.前言 由于客户端的环境不一致,有可能会造成我们预计不到的异常错误,所以在项目中,友好的异常信息提示,是非常重要的.在asp.net mvc中实现异常属性拦截也非常简单,只需要继承另一个类(Syst ...

  8. [P4318] 完全平方数

    想不出什么办法能直接算的(别跟我提分块打表),不如二分答案吧:设\(f(x)=\sum_{i=1}^n [i不是"完全平方数"]\), 显然f(x)与x正相关.再结合筛法.容斥,不 ...

  9. C# log4net 使用

    利用log4net写入异常类日志,在网上搜索一阵之后便想记录下来,以便后期使用,同时希望帮到大家.  第一步:使用管理NuGet程序包导入log4net.dll 导入成功后会在引用下显示相应的log4 ...

  10. 边缘化搭建 DotNet Core 2.1 自动化构建和部署环境(下)

    写在前面 本篇文章是上一篇边缘化搭建 DotNet Core 2.1 自动化发布和部署(上)的后续操作,本文主要讲解如何开启Docker Remote API,开启Remote API后的权限安全问题 ...