自学：前端本地化存储(HTML5)

常用的原生js设置本地化存储

Web storage

Local Storage

    Local Storage 方法存储的数据没有时间限制。只要你电脑没坏，数据依然存在，并且可用。想要删除必须得主动删除！

使用的方法：

localStorage.setItem('lastname','chan');//设置local Storage 键名，键值

localStorage.setItem('firstname','edison');

设置

localStorage.getItem('lastname');//获取lastname的键值

通过键名获取键值

localStorage.removeItem('lastname');//移除key为lastname的localStorage

移除了key为lastname

localStorage.clear();//清空localStorage

清空localStorage

Session Storage（会话）

sessionStorage 方法针对一个 session 进行数据存储。当关闭浏览器窗口后，数据会被删除。

方法跟localStorage相同，setItem,getItem,removeItem,clear~~~

Cookies

webstorage 跟cookie相似，但是cookie的大小是受限的，webstorage是为了大容量存储用的，而且cookie不能跨域调用，在每一次请求新的页面cookie都会放在Header数据包头中，浪费带宽，太可耻了！！！

最最最恶心的是他不像webstorage有setItem,getItem,removeItem,clear方法可以直接调用，需要我们自己封装setCookie，getCookie。

但是不用担心，如果你懒得自己写，我可以帮你解决

function setCookie(key,value,day){

var str=key+"="+value;//拼接字符串 键名对于键值

if (day) {//判断是否设置cookie时间限制

var now = new Date();//获取当前天

now.setDate(now.getDate()+day);//加上传入的day，设置失效天数；

str +="; expires="+now;//拼接字符串设置失效时间

}

document.cookie=str;//如果没有设置时间，直接插入cookie中

}

setCookie('lindsay','nice',3);

setCookie('edison','chan',15);

添加cookie

function getCookie(key){

var arr = document.cookie.split('; ');//正常控制台输出的cookie是个字符串，我们需要将其变成数组

for(var i=0;i

var keys =arr[i].split('=');//将数组中的值  键名，键值分开插入新的数组

if(keys[0]==key){//判断键名是否与我请求的cookie值相同

return keys[1];//相同返回键名对应的键值

}

}

}

console.log(getCookie('edison'));

控制台获取cookie  

调用自定义方法获取cookie

function delCookie(key){

setCookie(key,'',-1);//将传入的键名对应的键值设置为空，并且事件永远过期

}

delCookie('edison');

删除edison

还有一个是websql相关的知识，个人感觉用的比较少，就只是看了一看，了解了一下，基本就是套用公式一般，感觉会点SQL语句就可以运用好WEBSQL。如果想深入了解的话，可以问问度娘~~~