Javascript使用浏覽器本地存儲功能

 　　在日常的操作過程中，在所難免的需要利用Javascript在用戶浏覽器中本地存儲一些數據，以達到一些不能用服務器來識別的功能，如識別用戶的第二次訪問等。常用的方法有cookie，IE浏覽器的userData,以及localStorage等，由於userData只有IE支持，它的可擴展性並不大。

　　cookie:

　　cookie的好處是用戶每請求一次服務器數據，cookie則會隨著這些請求發送到服務器，服務器腳本語言如PHP等能夠處理cookie發送的數據，可以說是非常方便的。但是它的缺點也顯而易見，除開我們經常說的，浏覽器對cookie數量，大小的限制，我覺得更重要的一點,用js對cookie的操作相當的繁瑣，浏覽器只提供document.cookie這樣一個對象，對cookie的賦值，獲取都比較麻煩而在PHP中，我們可以通過setcookie()來設置cookie，通過$_COOKIE這個超全局數組來獲取cookie。下面是我封裝的Javascript操作和獲取cookie的函數:

　　function setcookie(name,value,expired,path,domain){

　　var now=new Date();

　　if(name==null){

　　throw "Cookie Name Must not be Null";

　　}else if (value==null){

　　throw "Cookie Value Must not be Null";

　　}else if(expired==null){

　　expired=0;

　　}

　　if(path==null){

　　path="/";

　　}

　　if(domain==null){

　　domain=window.location.host;

　　}

　　now.setTime(now.getTime()+expired*1000);

　　document.cookie=name+"="+escape(value)+";expires="+now.toGMTString()+";path="+path+";domain="+domain;

　　}

　　function getcookie(name){

　　var allcookie=document.cookie;

　　thiscookie=allcookie.match(name+"=[^s]*");

　　mycookie=thiscookie[0].split("=");

　　a=mycookie[1].substring(0,mycookie[1].length-1);

　　return unescape(a);

　　}

　　setcookie()前三個參數是必須，後面的的兩個參數分別代表路徑，有效期。當要刪除一個cookie時候，直接把有效期設置為負值即可。getcookie()函數用來獲取cookie內容，參數為相應cookie的name值。

　　從上面的例子可以看到用js訪問和操作cookie是比較麻煩的(相對於php等語言來說);

　　localStorage:

　　相對於cookie，localStorage的操作可謂方便快捷，它既能像普通對象一樣進行復制操作，也有相應API進行賦值，獲取，刪除，清空等操作，如，我要存儲host值為www.iefans.net，下面的方法均可以:

　　localStorage.host="www.iefans.net";

　　localStorage['host']="www.iefans.net";

　　localStorage.setItem("host","www.iefans.net");

　　//獲取

　　localStorage.host;

　　localStorage['host'];

　　localStorage.getItem("host");

　　//刪除

　　localStorage.removeItem("host");

　　//清空locaStorage

　　localStorage.clear();

　　從上面的例子可以看出，localStorage的操作靈活方便，非常好用。但是它也有一些缺點，第一是不會自動隨請求發到服務器，如果非要發送到的話，必須人工轉化為cookie或者通過ajax的方式發送;第二點是localStorage只有特定的浏覽器才能使用(支持HTML5)，而國內一些老舊的浏覽器依然占據著很大的市場，阻礙了localStorage的使用。