JavaScript的客戶端存儲

1、前言：

　　客戶端存儲實際上就是Web瀏覽器的記憶功能，經過瀏覽器的API實現數據存儲到硬盤；

2、存儲的不一樣形式：

　　一、Web存儲：localStorage 和 sessionStorage 表明同一個Storage對象--持久化的索引爲字符串，值也是字符串的數組；

　　　　　　　　二者出來對存儲的有效期和做用域不一樣，其餘基本通用；且做用域都是文檔源級別的，不能跨域存取；

　　　　　　　　localStorage     : 存儲的數據是永久性的，同源的文檔間共享數據；能夠讀取或覆蓋數據；可是受瀏覽器限制；

　　　　　　　　sessionStorage :做用域限制在窗口或標籤頁，標籤頁關閉後會刪除全部數據；

 　　　　　　　 二者均可以當作普通js對象使用，經過.key或[key]去設置和獲取數據，新的瀏覽器還提供了正式的API:

　　　　　　　　setItem()：設置對應的名稱和值，形如localStorage.setItem("x",1);

　　　　　　　　getItem(): 傳入名稱獲取對應的值,形如：localStorage.getItem("x");

　　　　　　　　removeItem():傳入名稱，刪除對應數據； clear():清空全部存儲的數據；

　　　　　　　　key() ：與length聯合使用 枚舉全部名稱：for(var i=0;i<storage.length;i++) {storage.key(i)};

　　二、cookie: cookie數據會自動在Web瀏覽器和Web服務器之間傳輸，所以服務器腳本能夠讀寫存儲在客戶端的cookie值；　　

　　　　　　　 cookie的限制：每一個Web服務器保存的cookie不能超過20個，每一個cookie保存的數據不能超過4kb;　 

//保存cookie:
function setCookie(name,value){
    //對value值進行表面,轉義分號，逗號和空白符;
    var cookie = name+""+encodeURIComponent(value);
    cookie += "; max-age="+3000;//設置有效期 毫秒數;
    cookie += ";path=/";        //設置做用域路徑
    cookie += ";domain="+domain;//做用域域名 只能是當前服務器的域;
    cookie += "; secure"; //設置此屬性，則只有經過HTTPS或其餘安全協議鏈接是才能傳遞cookie;
    
    document.cookie = cookie; //保存
}
//改變與刪除cookie都要使用相同的名字、路徑和域; 改變時,值設爲新的; 刪除時，設置max-age=0;
//讀取全部cookie值
function getCookie(){
    var cookies = {};
    var all = document.cookie;
    if(all === ""){
        return cookies;
    }
    var list = all.split("; ");
    for(var i in list){
        var cookie = list[i];
        var p = cookie.indexOf("=");
        cookies[cookie.substring(0,p)] = decodeURLComponent(cookie.substring(p+1));
    }
    return cookies;
}　　　　　

 　 三、客戶端數據庫(html5)：IndexedDB：一個對象數據庫；Chrome和FireFox新版本支持；

     四、文件系統(HTML5): 能夠操做本地文件系統進行讀寫文件和目錄的操做； 目前只有Chrome新版本的瀏覽器實現了；