您的位置:首页 > 其它

002-localStorage和sessionStorage操作

2018-02-26 16:52 253 查看

一、概述

  HTML5 提供了两种在客户端存储数据的新方法:

  localStorage - 没有时间限制的数据存储 一直存在除非用户手动清除缓存;是基于域的,任何该域下的所有页面都可访问localStorage
  sessionStorage - 针对一个 session 的数据存储 浏览器关闭时清除,生命周期(浏览器关闭时销毁).

二、操作方法

localStorage和sessionStorage都具有相同的操作方法,例如setItem、getItem和removeItem等

  设置值和取值也可以使用.符号,类似于取对象属性

setItem存储value

用途:将value存储到key字段
用法:.setItem( key, value)
代码示例:

sessionStorage.setItem("key", "value");
localStorage.setItem("site", "jd.com");

getItem获取value

用途:获取指定key本地存储的值
用法:.getItem(key)
代码示例:

var value = sessionStorage.getItem("key");
var site = localStorage.getItem("site");

removeItem删除key

用途:删除指定key本地存储的值
用法:.removeItem(key)
代码示例:

sessionStorage.removeItem("key");
localStorage.removeItem("site");

clear清除所有的key/value

用途:清除所有的key/value
用法:.clear()
代码示例:

sessionStorage.clear();
localStorage.clear();

三、无痕模式

判断浏览器是否无痕浏览模式

if (typeof localStorage === 'object') {
try {
localStorage.setItem('localStorage', 1);
localStorage.removeItem('localStorage');
return true;
} catch (e) {
//Storage.prototype._setItem = Storage.prototype.setItem;
//Storage.prototype.setItem = function() {};
alert('不支持本地存储');
return false;
}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: