html5 Web Storage(localStorage(),sessionStorage())
Web Storage包括了两种存储方式:sessionStorage和localStorage
sessionStorage 是会话级别的存储,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。
localStorage 是持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。
Web Storage与cookie异同
- cookie 支持的数据内容小,8k左右。localStorage目前能支持到10M。
- 每次请求一个新的页面的时候Cookie都会被发送过去,浪费了带宽。
- cookie 需要指定作用域,不可以跨域调用。
- Web Storage 拥有setItem,getItem,removeItem,clear等方法,cookie 需要前端开发者自己封装setCookie,getCookie方法。
localStorage浏览器支持情况
<script type="text/javascript">
// method one
if(window.localStorage){
alert("浏览支持localStorage")
}else{
alert("浏览暂不支持localStorage")
}
// method two
if(typeof window.localStorage == 'undefined') {
alert("浏览暂不支持localStorage")
}
</script>
localStorage和sessionStorage操作
- localStorage.setItem(key,value) // 设置键值对
- localStorage.getItem(key) // 通过键值读取对应的值
- localStorage.removeItem(key) // 通过键值移除对应的值
- localStorage.clear() // 初始化localStorage,清除所有键值对
- localStorage.key(index) // 通过下标index来获取指定索引的key名
其他操作方法:点操作和[ ]
<script type="text/javascript">
var storage = window.localStorage;
storage.key1 = "hello";
storage["key2"] = "world";
console.log(storage.key1);
console.log(storage["key2"]);
</script>
相关:IE专属存储 UserData.
html5 Web Storage(localStorage(),sessionStorage())的更多相关文章
- HTML5存储 ——Web Storage(localStorage 和 sessionStorage)
一.localStorage对象临时储存API 方法: 1.localStorage.setItem(key,value)---设置存储内容 2.localStorage.getItem(key)-- ...
- h5本地缓存(localStorage,sessionStorage)
H5本地存储数据 localStorage,sessionStorage的区别: 相同点: 缓存数据比cookie的范围大; localStorage:关闭浏览器数据不会消失,除非手动删除数据 se ...
- [web 前端] web本地存储(localStorage、sessionStorage)
cp from : https://blog.csdn.net/mjzhang1993/article/details/70820868 web 本地存储 (localStorage.sessionS ...
- web本地存储(localStorage、sessionStorage)
web 本地存储 (localStorage.sessionStorage) 说明 对浏览器来说,使用 Web Storage 存储键值对比存储 Cookie 方式更直观,而且容量更大,它包含两种:l ...
- web 本地存储 (localStorage、sessionStorage)
web 本地存储 (localStorage.sessionStorage,cookie) localStorage(长期储存):即使关闭浏览器数据也不会删除,除非使用localStorage.cle ...
- 使用HTML5 Web存储的localStorage和sessionStorage方式
localStorage(本地存储),可以长期存储数据,没有时间限制,一天,一年,两年甚至更长,数据都可以使用.sessionStorage(会话存储),只有在浏览器被关闭之前使用,创建另一个页面时同 ...
- Html5 web 本地存储 (localStorage、sessionStorage)
HTML5 提供了两种在客户端存储数据的新方法localStorage,sessionStorage sessionStorage(临时存储) :为每一个数据源维持一个存储区域,在浏览器打开期间存在, ...
- web存储机制(localStorage和sessionStorage)
web存储包括两种:sessionStorage 和 localStorage(都是限定在文档源级别,非同源文档间无法共享) 1.sessionStorage 数据放在服务器上(IE不支持) 严格用于 ...
- HTML5 web存储之LocalStorage和sessionStorage
什么是localstorage 前几天在老项目中发现有对cookie的操作觉得很奇怪,咨询下来是要缓存一些信息,以避免在URL上面传递参数,但没有考虑过cookie会带来什么问题: ① cookie大 ...
随机推荐
- Thinkphp框架感悟(一)
一.assign() /** * 分析: * 此处是Controller类里面的assign方法,我们一般写的控制器所调用的assign方法就是调的这个. * 而这个方法就干了三件事:1.获取传过来的 ...
- HDU1063 大数 java
Exponentiation Time Limit: 2000/500 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Tot ...
- c#面向对象基础 类、方法、方法重载
C#是纯粹的面向对象编程语言,它真正体现了“一切皆为对象”的精神.在C#中,即使是最基本的数据类型,如int,double,bool类型,都属于System.Object(Object为所有类型的基类 ...
- phpwind < v6 版本命令执行漏洞
phpwind/sort.php 会定期每天处理一次帖子的浏览量.回复量.精华版排序 代码直接使用savearray将数据库查询出来的内容写入php文件,savearray出来的参数,都使用" ...
- JAVA6开发WebService (一)
转载自http://wuhongyu.iteye.com/blog/807470 WebService是SOA的一种较好的实现方式,它将应用程序的不同功能单元通过中立的契约(独立于硬件平台.操作系统和 ...
- 3G網絡容量和業務承載的壓力大大增加!
在移動通信話音業務繼續保持發展的同時,對IP和高速數據業務的支持已經成為移動通信系統演進的方向.移動數據業務是推動目前移動通信技術發展的主要動力,TD-LTE作為準4G技術,以提高數據速率和頻譜利用率 ...
- html5 调用摄像头
---移动设备--- <input type="file" capture="camera" accept="image/*" id= ...
- Mongo中append方法使用
在MongoDB的官网已经很详细的介绍了各种客户端的使用,其中也包括java的,在此,仅对几个比较疑惑的地方做个标注: (1).如何向db中添加collection? 如果在api文档中找不到答案,那 ...
- 20145224&20145238《信息安全系统设计基础》实验四
20145224陈颢文20145238荆玉茗 <信息安全系统设计基础>第四次实验报告 课程:信息安全系统设计基础 班级: 1452 姓名:荆玉茗 陈颢文 学号:20145238 20145 ...
- 【转】NGUI研究院之为什么打开界面太慢(十三)
NGUI打开界面太慢了,起初一直以为是unity的问题,最近经过我的全面测试我发现这和unity没有关系.一般一个比较复杂的界面大概需要150个GameObject 或者 UISprite .我用N ...