如何使用localStorage替代cookie做本地存儲(chǔ)

這篇文章主要為大家展示了“如何使用localStorage替代cookie做本地存儲(chǔ)”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“如何使用localStorage替代cookie做本地存儲(chǔ)”這篇文章吧。

因?yàn)閏ookie存儲(chǔ)有限，加上cookie每次都要上傳到服務(wù)器，浪費(fèi)了帶寬不說，而且傷害了感情。

基于HTML5的localStorage可能能給你帶的新的希望，而且最大支持不超過5MB的數(shù)據(jù)存儲(chǔ)?？上У氖?，IE方面只支持IE8以上的版本。

我花了一點(diǎn)時(shí)間就最近瀏覽記錄的存儲(chǔ)簡單的寫了一個(gè)javascript代碼來做演示

late = {
 storage : {},
 isinit : 0,
 maxnum : 10,
 key : 'vestigial',
 _init:function(){
  if (late.isinit === 1) {
   return true;
  } else if (late.isinit === 0 && window.localStorage) {
   late.isinit = 1;
   late.storage = window.localStorage;
   return true;
  } else {
   return false;
  }
 },
 
 get:function(){
  if(late._init()){
   var data = late.storage.getItem(late.key);
   return JSON.parse(data);
  }else{
   return false;
  }
 },
 
 set:function(value){
  if(late._init()){
   var data = late.storage.getItem(late.key); 
   data = JSON.parse(data);
   if(data === null){
    data = [];
   }
   if (data.length === 10) {
    data.shift();
   }
   data.push(value);
   data = JSON.stringify(data);
   late.storage.setItem(late.key, data);
   return true;
  }else{
   return false;
  }
 }
};
 
var obj = {
  id:2, 
  title:'標(biāo)題1', 
  url:'http://www.baidu.com'
 };
late.set(obj);
var each = late.get();
var eachlength = each.length;
for(i=0; i<eachlength; i++){
 document.writeln(JSON.stringify(each[i]));
}

實(shí)在不行的話還可以使用flash來存儲(chǔ)，不建議使用cookie。

以上是“如何使用localStorage替代cookie做本地存儲(chǔ)”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！