localStorage兼容方案

localStorage是H5的存儲方案,各大瀏覽器支持都至關不錯,惟一悲催的就是IE,這個瀏覽器界的另類老是顯得格格不入。javascript

IE 「Internet選項」->「安全」中有一個「啓動保護模式」的單選項,在選中的狀況下localStorage是沒法使用的,直接提示「拒絕訪問」,就算不勾選,下次打開IE時也頗有可能彈出「是否啓用保護模式」的提示,此時除了作兼容沒有更好的辦法html

兼容方案一:userDatajava

userData是IE專屬的瀏覽器存儲機制,注意IE8+不支持(你說悲催不悲催)。userData的原理網上不少,就再也不贅述,您能夠點擊下方有參考資料查看,這裏直接貼出代碼瀏覽器

var box = document.body || document.documentElement || document.getElementsByTagName('head')[0];
var o = document.createElement("input");
o.type = "hidden";
o.style.display = "none";
o.addBehavior("#default#userData");
box.appendChild( o );
var exDate = new Date();
exDate.setDate(exDate.getDate()+365);
o.expires = exDate.toUTCString();//設定過時時間
var FileName = "localStorageKeyCache";
var cacheName = "kv";

o.setAttribute( cacheName , data.join(",") );
o.save( FileName );

o.load( FileName );
var getData = o.getAttribute( cacheName );
if( getData ){
   console.log( getData );
}

userData本質上是一個文件,所以存儲的時候須要提供文件名,而後就能夠經過setAttribute設置key/value,刪除能夠經過removeAttribute方法,無論對userData作什麼修改最後都須要經過save()方法進行保存安全

讀取userData必須先用load()方法加載文件,而後用getAttribute獲取cookie

因爲userData僅支持IE8如下的瀏覽器,IE9,10,11就的另想辦法app

兼容方案二:cookiespa

cookie一直都是localStorage兜底的辦法,無論哪一個版本的IE都支持,只惋惜存儲的數據少了點。cookie存儲數據網上不少教程,這裏再也不贅述.net

 

總結:htm

localStorage兼容,簡單的就直接判斷能用就用,不行就用cookie,我的感受userData實在雞肋,直接用cookie更方便

 

參考資料:

http://www.cnblogs.com/xiaohuochai/p/6595959.html

http://www.cnblogs.com/QLeelulu/archive/2008/03/29/1129322.html

http://blog.csdn.net/csyuyaoxiadn/article/details/12836955

相關文章
相關標籤/搜索