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; } }
相关文章推荐
- localStorage,箭头函数,
- day01-SSM框架前言——002——系统架构
- L3-002. 堆栈
- 剑指Offer编程练习002——替换空格
- 算法练习002
- L2-002. 链表去重
- OpenGL_002创建窗口
- H5的浏览器本地存储localStorage在IE中的坑
- H5的localStorage应该
- [转]来扯点ionic3[7] LocalStorage的使用—以登录和注销为例
- 2004-7-31 20:17:53 管理故事216之002-温水煮青蛙
- 4 phrases everyday-002
- 宅急送快递门事件最新进展002
- 泛型002
- ZY_MARC_002
- Yahoo! widget 教程002-第一个widget
- OWASP-CM-002
- 【交往智慧】002.和优秀的人接触
- ADF11g-002:为Backingbean创建基类
- 数据结构与算法分析100例之002(我自己敲的,我是菜鸟~!)