本文将会从总体上概述一下 sessionStorage 的用法。

 

关于sessionStorage 的相关属性和方法具体使用请参阅本版块相关文章。

 

功能和用法与localStorage非常相似，用于解决原有本地存储方案一些问题。

 

比如可以解决Cookie存储量小，且每次HTTP请求都会发送到服务器（浪费带宽）的问题。

 

关于localStorage可以参阅localStorage 用法一章节。

 

一.两种存储的异同点：

 

（1）.数据都存储在本地客户端。

 

（2）.存储量都比Cookie有明显的增加，因浏览器而已，大约在5M左右。

 

（3）.数据都不会跟随HTTP请求发送到服务器，节省带宽，与Cookie不同。

 

（4）.两者具有相同的方法与属性，毕竟两个对象都是从Storage 继承而来。

 

（5）.localStorage会在本地永久性存储，sessionStorage存储的数据仅在会话期间有效。

 

sessionStorage的数据共享和sessionStorage会话周期（生命周期）与localStorage有很大不同。

 

具体可以参阅如下两篇文章：

 

（1）.sessionStorage 数据共享一章节。

 

（2）.sessionStorag 生命周期一章节。

 

二.具有的属性与方法：

 

（1）.length属性：

 

[JavaScript] 纯文本查看 复制代码

1

sessionStorage.length

可以获取存储数据项的数量。

 

（2）.setItem()方法：

 

[JavaScript] 纯文本查看 复制代码

1

sessionStorage.setItem()

此方法可以新增或者修改sessionStorage对象中的一个数据项。

 

（3）.getItem()方法：

 

[JavaScript] 纯文本查看 复制代码

1

sessionStorage.getItem()

此方法可以获取指定键名对应的数据项的值。

 

（4）.removeItem()方法：

 

[JavaScript] 纯文本查看 复制代码

1

sessionStorage.removeItem()

此方法可以移除指定指定键名的数据项，无返回值。

 

（5）.clear()方法：

 

[JavaScript] 纯文本查看 复制代码

1

sessionStorage.clear()

此方法可以清除sessionStorage中所有的数据项。

 

（6）.key()方法：

 

[JavaScript] 纯文本查看 复制代码

1

sessionStorage.key()

通过此方法可以返回指定索引位置数据项的键名（不推荐使用此方法）。

 

三.事件：

 

具有storage 事件，具体参阅JavaScript storage 事件一章节。