javascript的本地存储 cookies、localStorage

一、cookies 本地存储

首先是常用的cookies方法，网上有很多相关的代码以及w3cSchool cookies。

 // 存储cookies
 function setCookie(name,value,expiredays)
 {
     var argv = setCookie.arguments;
     var argc = setCookie.arguments.length;
     var LargeExpDate = new Date ();
     var expires = (argc > 2) ? argv[2] : expiredays ;
     if(expires!=null)
     {
         LargeExpDate.setTime(LargeExpDate.getTime() + (expires*1000*3600*24));
     }
     document.cookie = name + "=" + escape (value)+((expires == null) ? "" : ("; expires=" +LargeExpDate.toGMTString()));
 }

 // 获取cookies
 function getCookie(Name)
 {
     var search = Name + "="
     if(document.cookie.length > 0)
     {
         offset = document.cookie.indexOf(search)
         if(offset != -1)
         {
             offset += search.length
             end = document.cookie.indexOf(";", offset)
             if(end == -1) end = document.cookie.length
             return unescape(document.cookie.substring(offset, end))
         }
         else return ""
     }
 } 

 // 删除cookies
 function deleteCookie(name)
 {
     var expdate = new Date();
     expdate.setTime(expdate.getTime() - (86400 * 1000 * 1));
     setCookie(name, "", expdate);
 } 

使用的时候直接调用就行。

// 存储
setCookie('名称',值,过期时间);
//过期时间可以不写
// 获取
getCookie('名称')
//删除
deleteCookie('名称');

查找子健

考虑当需要存储多个值在一条cookies时，可以把多个值按子健存入。

 

setCookie('openif2',"k1=1&k2=2&k3=3");
// 这时获取cookies时，可以单独获取每一个子健
var child = getCookie('openif2')
var childs = child.split('&');
for (var i = 0;i<childs.length;i++) {
    console.log(childs[i])
}

 

附（注意8小时时差）：

本地日期：toString()

本地日期：toLocaleString()

GMT世界时间：toGMTString()

UTC世界时间：toUTCString()

---

二、HTML5 本地存储

H5 web存储

支持性检测：

if （window.localStorage）{
    // 支持本地存储
}

localStorage

localStorage为永久性保存数据，不会随着浏览器的关闭而消失。

按域名进行存储，不会和其他域名冲突

键值对存储：key/value

 

localStorage API

1.setItem(key , value)，保存或设置数据。如果key已经存在，则覆盖key对应的value，如果不存在则添加key与value。

2.key(index); 获取指定下标位置的key

3.length 获取localStorage一共有多少条数据

　　　　　配合key(index)方法可以实现遍历localStorage数据的方法

4.clear(); 将同域名下的所有localStorage数据都清空

5.storage事件：当同源的localStorage或sessionStorage有更改以后，会触发这个事件。

6.removeItem():删除数据，通过key来删除相应的value

sessionStorage

sessionStorage为临时性保存数据，当页面关闭就会消失。其他一切与localStorage一样。

sessionStorage不能跨页面访问，也不会触发跨标签页的storage事件。它只局限在当前的标签页里。

 

注：使用H5方法添加的本地缓存不在cookies中，而在localStorage或sessionStorage里面。

---

 

以上是个人总结的一些关于本地存储的信息，希望能给需要的同学一些帮助。有问题或者有更好的建议，欢迎前来讨论！