cookie.js随记

cookie:

为了实现某些功能，把一些数据存储到用户的本地计算机。
注意事项：同源
    1）必须是服务环境
    2）不安全 ， 因为它存在了用户的本地机器上（临时存储）
    3）过期时间：
        默认：  session ——  会话时间（会话结束、浏览器关闭，cookie消失）
    4）大小、容量 一般 4K  左右，有的浏览器还有条数的限制
        —— 珍贵的资源
    5）不管看到的是什么，值都是String类型

使用jquery的插件:jquery.cookie.js
库： jquery.js
插件：jquery.cookie.js

要解决的两个问题：
1）如何来存储一个cookie
2）如何取出来用

1、存：写，种

$.cookie('cookename','cookievalue');
    cookie 是同源的,源头是一个——同一个域名下
Expires/Max - Age:
    表示的就是cookie的过期时间：默认值—— Session
        Session:  会话结束后（浏览器关闭）就消失
    不能存中文 encodeURI(users);

2、设置过期时间

$.cookie('cookie名字','cookie值',选项);
    选项：多个选项，JSON格式
        $.cookie('name',value,{
            expires: 天数
        });

3、读cookie

$.cookie('name');

4、路径问题

如果cookie路径path不一样：
    父读子 读不到
    子读父 能读到
通常,一个网站,只用一套cookie
解决： 选项  ——   path
    $.cookie(name,value,{
        expires:天数,
        path: '/'  ——// 通常情况下 设置为网站的根路径
    });

5、修改一个cookie 的值

设置方法一样：  
    $.cookie('name','新的value',{
        path: //  如果当前程序的path和cookie的path不一致，那么这里一定要指定path参数
    });

6、删除一个cookie

    1)设成空  ×
    2)右键-delete
    3)把过期时间设置成负值  √

7、使用jquery.cookie插件来设置cookie的时候，过期时间，和现在的时间相差8小时

expires:    数字 —— 天数
            日期对象—— 灵活设置

8、取出来的值，不管看上去是什么，其类型都是 string

* 既然cookie里存的都是字符串，那么在存的时候就明确的写成字符串，
    避免系统做对应的类型转换：  
        如: $.cookie('a',{a:1,b:1});  存的是  object Object   ×
            $.cookie('a','{"a":1,"b":1}');   √

本地存储：

html5，提供了一个新东西:localStorage,sessionStorage

• localStorage:IE8以上才能用

  注意事项：

    1、突破了cookie大小限制,5M —— 本地数据库
    2、html5支持这种写法，要求 ie8 以上的浏览器
    3、取出来的永远是字符串
    4、存储的内容非常大的时候,占内存严重，使网页的访问变慢 
    5、不能被爬虫抓取 不能SEO
  

  1、存一个值
  var ls = window.localStorage;
  ls.a = 'abc';
  ls['b'] = '1234';
  ls.setItem('c',89); // 推荐
  2、取一个值
  alert(ls.a);
  alert(ls['b']);
  alert(ls.getItem('c'));
  3、删除
  ls.removeItem('c');//删除一个
  ls.clear(); //删除所有

• sessionStorage：

  用法和 localStorage 的用法完全一致。

    localStorage:  永久存储 —— 除非手动删除
    sessionStorage: 会话结束就消失
  
    localStorage 或 sessionStorage 也是同源的
        （和cookie一致，在同一个域名下的数据可以互相访问）
  

访问所有的 localSorage 里的东西:

for(var i = 0; i< window.localStorage.length;i++){
    alert(window.localStorage.key(i));
    //key()方法，向其中出入索引即可获取对应的键
}

小总结:

cookie:
        特点：小 ，服务器下 ，过期时间，完全兼容，使用不方便！
        存 取 删
localStorage:
        特点：大，没有过期时间，IE8以上，使用还挺方便
        共同点：不安全、不能跨域、不能跨浏览器

原生JS操作cookie:

document.cookie
存：
    document.cookie = 'aaa';——只写了value=aaa，没有写name是多少

    document.cookie = 'test=abc';

    var oDate = new Date();
    oDate.setDate(oDate.getDate()+1);
    document.cookie = 'testDate=123456;path=/;expires='+oDate.toUTCString();;
读：
    document.cookie —— 各种切
删：时间设成负值