亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

本地存儲localStorage的封裝，提供簡單的API

Miyang / 2251人閱讀

摘要：是一個實現(xiàn)了瀏覽器的本地存儲的封裝，不是通過和技術(shù)實現(xiàn)，而是使用。小弟我主要是用于，，手機(jī)等先進(jìn)瀏覽器里面跑。

store.js 是一個實現(xiàn)了瀏覽器的本地存儲的 JavaScript 封裝 API，不是通過 Cookie 和 Flash 技術(shù)實現(xiàn)，而是使用 localStorage。小弟我主要是用于chrome，Safari，手機(jī)Web等先進(jìn)瀏覽器里面跑。so....大家可以做兼容哦....

比較詭異的是居然所有支持的瀏覽器目前都采用的5MB，盡管有一些瀏覽器可以讓用戶設(shè)置，但對于網(wǎng)頁制作者來說，目前的形勢就5MB來考慮是比較妥當(dāng)?shù)摹?/p>

Github地址

安裝 bower 
$ bower install storejs
npm 
$ npm install storejs
本地存儲APIs 
jsstore(key, data);                 //單個存儲字符串?dāng)?shù)據(jù)
store({key: data, key2: data2});  //批量存儲多個字符串?dāng)?shù)據(jù)
store(key);                       //獲取key的字符串?dāng)?shù)據(jù)
store();                          //獲取所有key/data
//store(false);（棄用）          //因為傳入空值 或者報錯很容易清空庫
store(key,false);                 //刪除key包括key的字符串?dāng)?shù)據(jù)

store.set(key, data[, overwrite]);//=== store(key, data);
store.setAll(data[, overwrite]);  //=== store({key: data, key2: data});
store.get(key[, alt]);            //=== store(key);
store.getAll();                   //=== store();
store.remove(key);                //===store(key,false)
store.clear();                    //清空所有key/data
store.keys();                     //返回所有key的數(shù)組
store.forEach(callback);          //循環(huán)遍歷，返回false結(jié)束遍歷

store.has(key);         //?判斷是否存在返回true/false          


//? 提供callback方法處理數(shù)據(jù)
store("test",function(arr){
    console.log(arr)//這里處理 通過test獲取的數(shù)據(jù)
    return [3,4,5]//返回數(shù)據(jù)并存儲
})

store(["key","key2"],function(arr){
    //獲取多個key的數(shù)據(jù)處理，return 并保存；
    console.log("arr:",arr)
    return "逐個更改數(shù)據(jù)"
})
set

單個存儲或刪除字符串?dāng)?shù)據(jù)
store.set(key, data[, overwrite]);
效果相同store(key, data);

jsstore.set("wcj","1")   //?  1
store.set("wcj")       //?  刪除wcj及字符串?dāng)?shù)據(jù)
setAll

批量存儲多個字符串?dāng)?shù)據(jù)
store.setAll(data[, overwrite])
效果相同store({key: data, key2: data});

jsstore.setAll({
    "wcj1":123,
    "wcj2":345
}) //存儲兩條字符串?dāng)?shù)據(jù)

store.setAll(["w1","w2","w3"]) 
//存儲三條字符串?dāng)?shù)據(jù) 
//  0? "w1"
//  1? "w2"
//  2? "w3"
get

獲取key的字符串?dāng)?shù)據(jù)
store.get(key[, alt])
效果相同store(key)

jsstore.get("wcj1") //獲取wcj1的字符串?dāng)?shù)據(jù)
store("wcj1") //功能同上
getAll

獲取所有key/data
store.getAll()
效果相同store()

jsstore.getAll() //?JSON
store() //功能同上
clear

清空所有key/data
store.clear()

棄用 ~~store(false)~~ 因為傳入空值 或者報錯很容易清空庫

jsstore.clear() //
keys

返回所有key的數(shù)組
store.keys()

jsstore.keys() //?["w1", "w2", "w3"]
has

判斷是否存在返回true/false
store.has(key)

jsstore.has("w1"); //?true
remove

刪除key包括key的字符串?dāng)?shù)據(jù)
store.remove(key)

jsstore.remove("w1"); //刪除w1 返回 w1的value

store("w1",false) //這樣也是 刪除w1
forEach

循環(huán)遍歷，返回false結(jié)束遍歷

jsstore.forEach(function(k,d){
    console.log(k,d)
    if (k== 3) return false
})
定時清除

(做個筆記，未來將定時清除封裝起來，有思路)

jsif (+new Date() > +new Date(2014, 11, 30)) {
    localStorage.removeItem("c");    //清除c的值
    // or localStorage.clear();
}
storage事件

HTML5的本地存儲，還提供了一個storage事件，可以對鍵值對的改變進(jìn)行監(jiān)聽，使用方法如下：

jsif(window.addEventListener){
     window.addEventListener("storage",handle_storage,false);
}else if(window.attachEvent){
    window.attachEvent("onstorage",handle_storage);
}
function handle_storage(e){
    if(!e){e=window.event;}
    //showStorage();
}

對于事件變量e，是一個StorageEvent對象，提供了一些實用的屬性，可以很好的觀察鍵值對的變化，如下表：

Property Type Description
key String The named key that was added, removed, or moddified
oldValue Any The previous value(now overwritten), or null if a new item was added
newValue Any The new value, or null if an item was added
url/uri String The page that called the method that triggered this change
兼容

來源：sessionStorage localStorage

特性 Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit) iPhone(IOS) Android Opera Mobile Window Phone
localStorage 4+ 3.5+ 8+ 10.50+ 4+ 3.2+ 2.1+ 11+ 8+
sessionStorage 5+ 2+ 8+ 10.50+ 4+ 3.2+ 2.1+ 11+ 8+
本地存儲大小

JSON.stringify(localStorage).length 當(dāng)前占用多大容量

檢測localstore容量上限

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/87690.html

相關(guān)文章

  • Web存儲之LocalStorage初探

    摘要：存儲之初探的發(fā)布和定稿為前端界帶來巨大的變化，新增的和特性給業(yè)務(wù)帶來了更多可能性，讓用戶體驗擁有了更可能的豐富。只讀返回一個整數(shù)，表示存儲在對象中的數(shù)據(jù)項數(shù)量。會在過期時間之后銷毀。安全性方面，中一般不建議存儲敏感信息。 Web存儲之LocalStorage初探 HTML5的發(fā)布和定稿為前端界帶來巨大的變化，新增的API和特性給業(yè)務(wù)帶來了更多可能性，讓用戶體驗擁有了更可能的豐富。 · ...

    wpw 評論0 收藏0

  • 關(guān)于網(wǎng)頁本地存儲的一些思考

    摘要：于是一個擁有版本控制和過期控制的本地內(nèi)容存儲功能模塊就算初步完成了。最后基于這個事情的考慮，于是順便寫了個本地存儲控制的庫，基本都在上面了 前言 關(guān)于localStorage sessionStorage之類的api怎么用已經(jīng)無需我再贅述了，但是具體怎么落實到一個稍微復(fù)雜一些的業(yè)務(wù)中還是需要做一些前期的準(zhǔn)備 遇見的一些問題 1.localStorage 與 sessionStorage...

    陳江龍 評論0 收藏0

  • 關(guān)于網(wǎng)頁本地存儲的一些思考

    摘要：于是一個擁有版本控制和過期控制的本地內(nèi)容存儲功能模塊就算初步完成了。最后基于這個事情的考慮，于是順便寫了個本地存儲控制的庫，基本都在上面了 前言 關(guān)于localStorage sessionStorage之類的api怎么用已經(jīng)無需我再贅述了，但是具體怎么落實到一個稍微復(fù)雜一些的業(yè)務(wù)中還是需要做一些前期的準(zhǔn)備 遇見的一些問題 1.localStorage 與 sessionStorage...

    henry14 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<