摘要:介紹是針對(duì)瀏覽器的一個(gè)便捷操作插件。也是作者的第一個(gè)插件,不足之處還請(qǐng)見諒和指正。安裝使用支持操作。詳見此版本改動(dòng)較大,涉及方法名稱的語(yǔ)義化,新方法的添加,方法廢棄,新增本地調(diào)試代碼,信息進(jìn)一步優(yōu)化。
iStorage
Local Storage 是 HTML 5 新增的一個(gè)本地存儲(chǔ) API,所謂 Local Storage 就是一個(gè)小倉(cāng)庫(kù)的意思,它有 5 M 的大小空間,存儲(chǔ)在瀏覽器中,我們可以通過(guò) JavaScript 來(lái)操縱 Local Storage。iStorage 介紹
iStorage是針對(duì)瀏覽器 Local Storage 的一個(gè)便捷操作插件。它支持用戶直接存儲(chǔ)和獲取數(shù)字(非 NaN)、字符串、數(shù)組、JSON 類型數(shù)據(jù)。
iStorage 是基于原生 JavaScript 實(shí)現(xiàn)的,它編譯壓縮后僅 2kb 左右,請(qǐng)放心試用。也是作者的第一個(gè) NPM 插件,不足之處還請(qǐng)見諒和指正。
iStorage 安裝iStorage 支持 CommonJS RequireJS iStorage 使用
iStorage 支持 getLength getIndex getItem setItem removeItem clearAll 操作。debug 尾參數(shù)可選,用于在控制臺(tái)打印操作詳情日志。
// 獲取 Local Storage Length iStorage.getLength(debug: Boolean); // 根據(jù) Local Storage 的長(zhǎng)度(length)作為索引值,來(lái)獲取鍵名 iStorage.getIndex(index:Number, debug: Boolean); // 依據(jù)鍵名獲取值 iStorage.getItem(key: String, debug: Boolean); // 添加鍵值對(duì),值類型允許長(zhǎng)度為0 iStorage.setItem(key:String, value:!NaN || Number || String || Array || JSON, debug:Boolean) // 刪除鍵值對(duì) iStorage.removeItem(key: String, debug: Boolean); // 清楚該域的所有Local Storage 記錄 iStorage.clearAll(key: String, debug: Boolean);iStorage 本地測(cè)試
// 請(qǐng)先f(wàn)ork,下載到本地后命令行初始化開發(fā)調(diào)試環(huán)境: > npm i // 安裝 uglify-js 用于壓縮生產(chǎn) > npm test // webpack-dev-server open: http://localhost:9000/ // 若要修改插件,比如 0.0.3 版,請(qǐng)參考以下指令 // 修改未壓縮版本 iStorage.js, 修改完后,使用 uglify-js 壓縮 > uglifyjs iStorage.js -m -c -o iStorage.min.jsiStorage 未來(lái)
使用 TypeScript 重構(gòu),添加 sessionStorage 和 cookie,并希望支持異步操作.
iStorage 更新日志 0.0.1第一版代碼比較粗糙,僅用于驗(yàn)證代碼結(jié)構(gòu)和方法的設(shè)計(jì)、插件的實(shí)際用途。基本實(shí)現(xiàn)了數(shù)字、字符串、數(shù)組、JSON 對(duì)象四種基本數(shù)據(jù)的類型檢測(cè),直接存儲(chǔ)和獲取;方法上實(shí)現(xiàn)了:
check: 檢查某個(gè)鍵名是否存在
get:獲取某個(gè)鍵名的值
set:設(shè)置鍵值對(duì)
remove:根據(jù)鍵名刪除某個(gè)鍵值對(duì)
詳見 redeme@0.0.1
0.0.2該版本在代碼上進(jìn)行了完善,并提供了更好 debug log 信息。
詳見 redeme@0.0.2
0.0.3此版本改動(dòng)較大,涉及方法名稱的語(yǔ)義化,新方法的添加,check 方法廢棄,新增本地 Webpack 調(diào)試代碼,debug log 信息進(jìn)一步優(yōu)化。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.hztianpu.com/yun/94252.html
摘要:定時(shí)器時(shí)間到了就將中存的信息以及存的時(shí)間信息就是那個(gè)對(duì)象中的刪掉就行了。難道存了三條我就做三個(gè)定時(shí)器存的條我就做個(gè)定時(shí)器這也太了而且也并不符合實(shí)際。 一、酷酷的開頭 在潛水的時(shí)間長(zhǎng)達(dá)一年之后,我終于鼓起勇氣開始寫我的第一篇文章了。前端小菜,只是想記錄一下自己的想法,望各位看到這文的大佬輕噴。 在現(xiàn)在前后端分離的開發(fā)模式下,存儲(chǔ)信息一般都不在使用以往使用的cookie了,就拿筆主我之前做...
摘要:擴(kuò)展應(yīng)用模塊功能介紹擴(kuò)展應(yīng)用由很多部分組成,其中主要模塊為為了避免由于翻譯原因?qū)е碌膯栴},因此在下文中對(duì)相關(guān)模塊的稱呼一律采用上面的英文。附錄官方開發(fā)文檔英建議有英文閱讀能力的人閱讀此文檔。 概述 本文通過(guò)對(duì)chrome插件的各個(gè)部分進(jìn)行快速的介紹,從而讓大家了解插件各個(gè)部分的關(guān)系,并且知道如何將其進(jìn)行組裝成一個(gè)完整的chrome插件。 由于chrome官方文檔中對(duì)于如何從零開發(fā)一個(gè)c...
摘要:老板查崗時(shí),一個(gè)快捷鍵,立即關(guān)閉所有賴皮頁(yè)面。上傳,發(fā)布插件。從零開始,開發(fā)簡(jiǎn)單的一鍵賴皮插件的上班族都在使用瀏覽器賴皮,所以我們選擇采用插件來(lái)實(shí)現(xiàn)功能。 很多人介紹過(guò)Chrome插件,但必須要說(shuō),插件開發(fā)就是擺弄一個(gè)小玩具,第一要素是實(shí)用,其次是好玩。 單純羅列各種功能是非常無(wú)趣的。 所以把一篇舊文拿出來(lái)與大家分享。 人,活著就是為了賴皮。 作為一個(gè)合格的開發(fā)人員,把30%的時(shí)間用...
摘要:小結(jié)本文只是簡(jiǎn)單分享了如何開發(fā)一個(gè)簡(jiǎn)單的谷歌瀏覽器插件,以及一些注意事項(xiàng),并且提到了如何授權(quán)和使用谷歌插件,重點(diǎn)介紹了插件開發(fā)必備的入口文件和插件中幾個(gè)重要環(huán)境以及環(huán)境之間的通信。 我們?cè)谏暇W(wǎng)的時(shí)候,都會(huì)用到瀏覽器,但是瀏覽器并非擁有我們想要的所有功能,我們可以根據(jù)自己的需要,實(shí)現(xiàn)自己的插件來(lái)滿足需求。比如網(wǎng)頁(yè)中經(jīng)常會(huì)有大量的廣告,如果你希望擁有一個(gè)純凈的網(wǎng)頁(yè),可以實(shí)現(xiàn)一個(gè)插件來(lái)刪除網(wǎng)...
摘要:小結(jié)本文只是簡(jiǎn)單分享了如何開發(fā)一個(gè)簡(jiǎn)單的谷歌瀏覽器插件,以及一些注意事項(xiàng),并且提到了如何授權(quán)和使用谷歌插件,重點(diǎn)介紹了插件開發(fā)必備的入口文件和插件中幾個(gè)重要環(huán)境以及環(huán)境之間的通信。 我們?cè)谏暇W(wǎng)的時(shí)候,都會(huì)用到瀏覽器,但是瀏覽器并非擁有我們想要的所有功能,我們可以根據(jù)自己的需要,實(shí)現(xiàn)自己的插件來(lái)滿足需求。比如網(wǎng)頁(yè)中經(jīng)常會(huì)有大量的廣告,如果你希望擁有一個(gè)純凈的網(wǎng)頁(yè),可以實(shí)現(xiàn)一個(gè)插件來(lái)刪除網(wǎng)...
閱讀 783·2021-11-16 11:44
閱讀 3636·2019-08-26 12:13
閱讀 3291·2019-08-26 10:46
閱讀 2416·2019-08-23 12:37
閱讀 1259·2019-08-22 18:30
閱讀 2596·2019-08-22 17:30
閱讀 1902·2019-08-22 17:26
閱讀 2352·2019-08-22 16:20