什么是本地存储
以下内容从网上抄来的
HTML5 storage 提供了一种方式让网站能够把信息存储到你本地的计算机上,并再以后需要的时候进行获取。这个概念和 cookie 相似,区别是它是为了更大容量存储设计的。Cookie 的大小是受限的,并且每次你请求一个新的页面的时候 cookie 都会被发送过去。HTML5 的 storage 是存储在你的计算机上,网站在页面加载完毕后可以通过 Javascript 来获取这些数据。
简单的说本地存储是 HTML5 的一部分。更为详细准确的说是本地存储过去是 HTML5 的标准中的一部分,而后来由于有些工作组的人表示 HTML5 太庞大了,于是就剥离出来作为一个单独的标准。这听起来好像是把一块馅饼分成很多块目的是为了减少总的卡路里……
为什么要用本地存储
其实前面已经提到了,用本地存储有这些好处
- 本地存储和 cookie 一样提供了把数据保存到本地的能力,页面刷新或者关掉浏览器后,数据依然存在
- 大!虽然不同浏览器的标准可能不一样,主流的一般都在 5~10M,比 cookie 的 4k 强多了
- 本地存储的数据不会被发到服务器,与 cookie 相比,节省带宽,加快响应速度
所以,如果需要保存一些数据到用户的浏览器,而这些数据又不需要每个请求都提交给服务器,不妨考虑使用本地存储。
如何使用
首先,得检查浏览器是否支持本地存储
可以通过检测 window 下面是否有 localStorage 字段来判断,但是在 IE 下,本地文件是不能访问 localStorage 的,此时 localStorage 字段为空,所以还要加上判断
|
'localStorage' in window && window['localStorage']!== null |
还有一种情况,假如页面里有 id 为 localStorage 的元素,某些浏览器可以通过 window.localStorage 索引到这个元素-___,-||
为了避免你的代码在遇到如此蛋疼的 DOM 时跪掉,我建议是使用特征检查
|
window.localStorage && window.localStorage.getItem |