LocalStorage本地存储

在HTML5中，新加入了一个localStorage特性，这个特性主要是用来作为本地存储来使用的，解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k)，localStorage中一般浏览器支持的是5M大小，这个在不同的浏览器中localStorage会有所不同。localStorage属于永久性存储，不可被爬虫抓取。
localStorage存储的数据是不能跨浏览器共用的，也就是说存储在浏览器的数据只能在这个浏览器中访问。
如果存储进去的是int类型，打印出来会是string类型，这个与localStorage本身的特点有关，localStorage只支持string类型的存储。

常用的API如下表所示：

表格来源

名称	作用
clear	清空localStorage上存储的数据
getItem	读取数据
hasOwnProperty	检查localStorage上是否保存了变量x，需要传入x
key	读取第i个数据的名字或称为键值(从0开始计数)
length localStorage	存储变量的个数
propertyIsEnumerable	用来检测属性是否属于某个对象的
removeItem	删除某个具体变量
setItem	存储数据
toLocaleString	将（数组）转为本地字符串
valueOf	获取所有存储的数据

---

详细介绍

数据来源一         数据来源二
localStorage.getItem(key)：
获取指定key本地存储的值，不会自动将Json对象转成字符串形式，如果key的value不存在时，返回null

语法：localStorage.getItem(key,value)
示例：
localStorage.getItem("name");【推荐写法】
var name = localStorage.name;
var name = localStorage["name"];

localStorage.setItem(key,value)：
将value存储到key字段，如果key的value存在时，更新key的值,

语法：localStorage.setItem(key,value)
示例：
localStorage.setItem("name","moomoo");【推荐写法】
localStorage.name = "moomoo";
localStorage["name"] = "moomoo";

localStorage.removeItem(key) 和 localStorage.clear()：
删除指定key本地存储的值，表示清除单项key的值

语法：localStorage.remove(key)
示例:
localStorage.remove("name");  //执行这句话就会清除name的值
localStorage.clear(),  //表示清除localStorage存储的所有数据

读取数据

示例：
localStorage.getItem("name") //caibin,读取保存在localStorage对象里名为name的变量的值
localStorage.name // 同上
"caibin"localStorage.valueOf() //读取存储在localStorage上的所有数据
localStorage.key(0) // 读取第一条数据的变量名(键值)//遍历并输出localStorage里存储的名字和值

遍历数据

示例：
for(var i=0; i<localStorage.length;i++){
    console.log('localStorage里存储的第'+
    i+'条数据的名字为：'+
    localStorage.key(i)+',值为：'+
    localStorage.getItem(localStorage.key(i)));}

如何存储JSON对象：
localStorage.setItem() 不会自动将Json对象转成字符串形式，用localStorage.setItem()正确存储JSON对象方法是，存储前先用JSON.stringify()方法将json对象转换成字符串形式，后续要操作该JSON对象，要将之前存储的JSON字符串先转成JSON对象再进行操作：

示例一：
1 var obj = {"a": 1,"b": 2};
2 typeof localStorage.getItem("temp2");//也会返回String
3 localStorage.setItem("temp2", obj);//但是返回[object Object]

示例二：
JSON.stringify() 方法可以将任意的 JavaScript 值序列化成 JSON 字符串
1 var obj = {"a": 1,"b": 2};
2 obj = JSON.stringify(obj); //转化为JSON字符串
3 localStorage.setItem("temp2", obj);//返回{"a":1,"b":2}

示例三：
后续要操作该JSON对象，要将之前存储的JSON字符串先转成JSON对象再进行操作
1 obj=JSON.parse(localStorage.getItem("temp2"));

示例四：
var storage=window.localStorage;
            var data={
                name:'xiecanyong',
                sex:'man',
                hobby:'program'
            };
            var d=JSON.stringify(data);
            storage.setItem("data",d);
            //将JSON字符串转换成为JSON对象输出
            var json=storage.getItem("data");
            var jsonObj=JSON.parse(json);
            console.log(typeof jsonObj);