源码可以到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. [Project] MiniSearch文本检索简介

    1. 预处理过程 预处理主要用来事先生成程序在运行过程中可能用到的数据,以便加速处理时间. 预处理的过程主要生成程序所需的三个文件:网页库文件,网页位置信息文件和倒排索引文件. 网页库文件 其中网页库 ...

  2. UWP忽略短时间内重复触发的事件

    原链接:UWP忽略短时间内重复触发的事件 - 超威蓝火 做移动端开发的可能都会遇到这种需求,当用户点击一个按钮之后,由于没有异步,或者设备性能很差等等原因,程序卡住了.但是用户不知道是咋回事啊,就开始 ...

  3. Java 虚拟机的对象创建

    堆中存储的内容:在程序运行时,动态创建的对象. 创建对象的四种方式:new,clone(浅复制),反射,反序列化. 浅复制:只能复制当前对象本身,如果当前对象(A)引用了另外的对象(B),则引用对象( ...

  4. Android精通之OrmLite数据库框架,Picasso框架,Okio框架,OKHttp框架

    版权声明:未经博主允许不得转载 OrmLite基础知识 什么是OrmLite框架,在我没用这个框架时,不知道它有多好,用了才知道很方便哦,为了提供开发效率,Android开发者需要懂得运行多种框架进行 ...

  5. 第十节:详细讲解一下Java多线程,随机文件

    前言 大家好,给大家带来第十节:详细讲解一下Java多线程,随机文件的概述,希望你们喜欢 多线程的概念 线程的生命周期 多线程程序的设计 多线程的概念 多线程的概念:程序是静态的,进程是动态的.多进程 ...

  6. ELKstack简介及环境部署

    ELK工作流程图 环境准备 安装Logstash依赖包JDK Logstash的运行依赖于Java运行环境, Logstash 1.5以上不低于java 7推荐使用最新版本的Java.由于只是运行Ja ...

  7. 内链接、左右连接、union并集

    第一个:内连接接 inner join select   *   from   a   inner   join   b   on   a.id=b.id where a.id =b.id (这种用法 ...

  8. oracle查锁及解锁命令

    --查询行锁语句 select sql_text from v$sql a,v$session b where a.sql_id=b.sql_id and b.event='enq: TX - row ...

  9. 全网最详细的Eclipse里如何正确新建普通的Java web项目并发布到Tomcat上运行成功【博主强烈推荐】(图文详解)

    不多说,直接上干货! 首先,大家要明确,IDEA.Eclipse和MyEclipse等编辑器之间的新建和运行手法是不一样的. 如果是在Myeclipse里,则是File -> new -> ...

  10. sql语句出错:Column count doesn't match value count at row 1

    报错内容: java.sql.SQLException: Column count doesn't match value count at row 1 at com.mysql.jdbc.SQLEr ...