使用sessionstorage实现缓存的存储和获取

SessionStorage是HTML5提供的一种客户端存储机制。通过SessionStorage可以在浏览器中缓存临时数据，这些数据将保存在当前会话的周期内，一旦会话结束，数据也将被清除。使用SessionStorage存储和获取数据非常简单，只需遵循以下步骤：

1. 存储数据：调用SessionStorage对象的setItem()方法，将数据以键值对的方式存储在SessionStorage对象中，示例代码如下：

sessionStorage.setItem('key', 'value');

2. 获取数据：调用SessionStorage对象的getItem()方法，传入要获取的数据的键，即可获取该键的值，示例代码如下：

var value = sessionStorage.getItem('key');

3. 删除数据：调用SessionStorage对象的removeItem()方法，传入要删除的数据的键，即可删除该键对应的数据。

sessionStorage.removeItem('key');

SessionStorage存储的数据类型可以是字符串、数字、布尔值和对象等，存储时会自动将数据转换为字符串格式，取出时如果原本是其他数据类型则需手动转换。

需要注意的是，存储的数据大小有限制，不同浏览器限制大小不一样，一般在5-10MB之间，超出大小限制会报错。同时，SessionStorage的数据存储范围是当前页面的同源页面，即只能在同一个协议、同一个域名、同一个端口下的页面共享数据，不同页面之间无法共享数据。

总的来说，SessionStorage是一种轻量级的客户端缓存方案，适合存储一些临时数据，如表单数据、用户偏好设置等。