深入理解HTML5之sessionStorage对象
HTML5 sessionStorage会话储备
sessionStorage 是HTML5新增的一个会话储备对象，用于暂时留存统一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。本篇主要介绍 sessionStorage(会话储备)的使用方式。包罗增加、修改、删除等操纵。
名目
1. 介绍
1.1 说明
1.2 特点
1.3 阅读器最小版本支撑
1.4 适合场景
2. 成员
2.1 属性
2.2 办法
3. 示例
3.1 储备数据
3.2 读取数据
3.3 储备Json对象
1. 介绍
1.1 说明
sessionStorage 是HTML5新增的一个会话储备对象，用于暂时留存统一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。
在JavaScript说话中可通过 window.sessionStorage 或 sessionStorage 调取此对象。
1.2 特点
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.3 阅读器最小版本支撑
支撑sessionStorage的阅读器最小版本：IE8、Chrome 5。
1.4 适合场景
sessionStorage 非常适合SPA(单页利用程序)，可以利便在各业务模块停止传值。
2. 成员
2.1 属性
readonly int sessionStorage.length ：返回一个整数，表示储备在
sessionStorage 对象中的数据项(键值对)数目。
2.2 办法
string sessionStorage.key(int
index) ：返回当前 sessionStorage 对象的第index序号的key名称。若没有返回null。
string sessionStorage.getItem(string
key) ：返回键名(key)对应的值(value)。若没有返回null。
void sessionStorage.setItem(string
key, string value) ：该办法接受一个键名(key)和值(value)作为参数，将键值对增加到储备中；假如键名存在，则更新其对应的值。
void sessionStorage.removeItem(string
key) ：将指定的键名(key)从 sessionStorage 对象中移除。
void sessionStorage.clear()
：清除 sessionStorage 对象所有的项。
3. 示例
3.1 储备数据
3.1.1 采纳setItem()办法储备
sessionStorage.setItem('testKey','这是一个测试的value值'); // 存入一个值3.1.2 通过属性方式储备
sessionStorage['testKey'] = '这是一个测试的value值';
3.2 读取数据
3.2.1 通过getItem()办法取值
sessionStorage.getItem('testKey'); // => 返回testKey对应的值
3.2.2 通过属性方式取值
sessionStorage['testKey']; // => 这是一个测试的value值
3.3 储备Json对象
sessionStorage也可储备Json对象：储备时，通过JSON.stringify()将对象转换为文本格局；读取时，通过JSON.parse()将文本转换回对象。
var userEntity = {
name: 'tom',
age: 22
};
// 储备值：将对象转换为Json字符串
sessionStorage.setItem('user', JSON.stringify(userEntity));
// 取值时：把猎取到的Json字符串转换回对象
var userJsonStr = sessionStorage.getItem('user');
userEntity = JSON.parse(userJsonStr);
console.log(userEntity.name); // => tom以上就是深入理解HTML5之sessionStorage对象的具体内容，更多请关注百分百源码网其它相关文章！
