1.localStorage是什么
localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。
2.localStorage有哪些优点
1. 存储空间
存储空间 更大:IE8下每个独立的存储空间为10M,其他浏览器实现略有不同,但都比Cookie要大很多。
2. 服务器
存储内容不会发送到服务器:当设置了Cookie后,Cookie的内容会随着请求一并发送的服务器,这对于本地存储的数据是一种带宽浪费。而Web Storage中的数据则仅仅是存在本地,不会与服务器发生任何交互。
3.接口
更多丰富易用的接口:Web Storage提供了一套更为丰富的接口,使得数据操作更为简便。
4. 存储空间
独立的存储空间:每个域(包括子域)有独立的存储空间,各个存储空间是完全独立的,因此不会造成数据混乱。
当把当前网页或者浏览器关掉并再进入时,localStorage中的数据还是存在的。那么,这个数据是存在什么地方的呢?
查找后发现对于Chrome Browser, 其缺省存在以下地址:
C:/Documents and Settings/UserName/Local Settings/Application Data/Google/Chrome/User Data/Default/Local Storage
在这个目录中可以看到一系列以如下方式命名的文件:
http_login.taobao.com_0.localstorage
http_t.sina.com.cn_0.localstorage
chrome_newtab_0.localstorage
…
可以看到每个名字中都有一个网络地址来标识。尝试用文本文件打开一个文件时,发现其是sqlite3的数据库。以刚才存储的那个文件chrome_newtab_0.localstorage为例,用sqlite3打开:
>sqlite3 chrome_newtab_0.localstorage
sqlite>.schma
CREATE TABLE ItemTable (key TEXT UNIQUE ON CONFLICT REPLACE, value TEXT NOT NULL ON CONFLICT FAIL);
sqlite>.mode column
sqlite>.headers on
sqlite>select * from ItemTable;
key value
———- ———-
abc 1
bcd 2
id1 abc
id2 bcd
总结:
1)本地存储是以localStorage来操作的,具体为: window.localStorage;
2)localStorage是以(Key, Value)的方式读取和设置的;
3)Chrome中,不同的网址的localStorage是以不同的文件存储的,文件名中包含了相应地址;
4)Chrome中,文件是以sqlite3的数据库方式来存储的;
3.浏览器对localStorage的支持情况
转一个测试结果
Chrome4+ 开始支持localStorage
Firefox3.5+开始支持localStorage
Firefox1.5+支持globalStorage
IE8+支持localStorage
IE7兼容模式支持localStorage
IE5.5+支持userdata
Safari 4+ 支持localStorage
Opera10.5+支持localStorage
Netscape Navigator最后一版(9.0.0.6)支持localStorage,其余版本未测
现在主流的浏览器除ie6,ie7外都支持localstorage,可以支持的用localstorage,不支持的用cookie代替
4.localStorage的用法
localStorage. length:返回现在已经存储的变量数目。
localStorage. key(n):返回第n个变量的键值(key)。
localStorage.getItem(k):和localStorage.k一样,取得键值为k的变量的值。
localStorage.setItem(k , v):和localStorage.k = v一样,设置键值k的变量值。
localStorage.removeItem(k):删除键值为k的变量。
localStorage.clear():清空所有变量。
6.localStorage在浏览器的保存