兼容性:chrome, safari, firefox,IE 9,IE8都支持 localStoragejavascript
下載地址: https://yunpan.cn/cSL385VVmJk8v 訪問密碼 7e3ecss
Git地址:https://github.com/marcuswestin/store.jsjava
注意:我這裏對git上的js進行了一下修改。好比onStorage這個方法,git上的js中修改/新增值都是set,我這裏處理了下修改時update,新增時set。其實你們也能夠根據本身需求去修改,git上封裝的仍是比較好的。git
引入JS <script type="text/javascript" src="${ctx}/hollybeacon/common/store/store.min.js"></script> 單個存儲 store(key,value); //store('name','chenyao'); store.set(key,value); //store.set('name','chenyao'); json形式多個存儲 store({key:value,key:value}); //var arr = {'sex':'男','pwd':'xi199321'}; store(arr); store.setAll(arr1); //=== store({key: data, key2: data}); 注意: 存儲key/value爲undefined/""的時候直接會被幹掉。 獲取key的值 store(key);//store('name') store.get(key);//store.get('name'); 獲取全部的key的值 store(); store.getAll(); 刪除某個key/value store.remove(key); //store.remove('name'); store(key,false); //store('name',false); //清空全部的key/value store.clear(); //獲取全部的key store.keys() //返回全部key的數組["pwd1", "sex1"] //判斷是否存在key store.has(key); //store.has('name'); //循環遍歷,返回false結束遍歷 store.forEach(function(k,v){ console.log(k,v); if (k== 'name') return false; }) //獲取key的總數 store.size() //建立(set)/更新(update)/刪除(remove)/清空(clear)數據項時,觸發該事件 store.onStorage(function(type,key,val){ console.log("event:",type,key,val) })
注意:
一、set/setAll/clear/forEach/onStorage均可以鏈式操做github
eg:store.forEach(function(k,v){ console.log(k,v); if (k== 'name') return false; }).get('name');
二、存儲的時候也能夠存入數組、json等等對象chrome
var arr1 = new Array(); arr[0] = '1'; arr[1] = '2'; var arr2 = { "employees": [ { "firstName":"John" , "lastName":"Doe" }, { "firstName":"Anna" , "lastName":"Smith" }, { "firstName":"Peter" , "lastName":"Jones" } ] } var arr3 = {'arr1':arr,'arr2':arr2}; store.setAll(arr3);
三、因爲localStorage自己不支持有效期這種設置,擴展方案:
json
fucntion timeRemove(date1,date2,key){ if(date1>date2){ if(key != undefined && key != "" && store.get(key) != undefined){ store.remove(key); }else{ store.clear(); } } }
四、js在線壓縮網址:http://tool.css-js.com/數組