成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

localStorage 學(xué)習(xí)

ddongjian0000 / 1369人閱讀

摘要：基本方法添加鍵值對(duì)，如果存在時(shí)，更新。清除所有鍵值對(duì)。也就是說，只要用戶不主動(dòng)刪除，存儲(chǔ)的數(shù)據(jù)將會(huì)永久存在。在使用進(jìn)行存取操作的同時(shí)，如果需要對(duì)存取操作進(jìn)行監(jiān)聽，可以使用內(nèi)置的事件監(jiān)聽器對(duì)數(shù)據(jù)進(jìn)行監(jiān)控。

1.localStorage 基本方法

添加鍵值對(duì)：localStorage.setItem(key,value)，如果key存在時(shí)，更新value。

　　獲取鍵值：localStorage.getItem(key)，如果key不存在返回null。

　　刪除鍵值對(duì)：localStorage.removeItem(key)。key對(duì)應(yīng)的數(shù)據(jù)將會(huì)全部刪除。

　　清除所有鍵值對(duì)：localStorage.clear()。如果調(diào)用clear()方法，清空localStorage中所有信息，那么key、oldValue和newValue都會(huì)被設(shè)置為null。

　　獲取localStorage的屬性名稱（鍵名稱）：localStorage.key(index)。

還有一個(gè)和普通對(duì)象不一樣的屬性length:

　　獲取localStorage中保存的鍵值對(duì)的數(shù)量：localStorage.length。

2.存儲(chǔ)格式

localStorage對(duì)象的鍵和值只能是字符串，假設(shè)我們要保存一個(gè)對(duì)象到localStorage中，可以使用拼接的方式。當(dāng)然也可以借助JSON類，將對(duì)象轉(zhuǎn)換成字符串保存，然后在取出來的時(shí)候?qū)son字符串轉(zhuǎn)換成真正可用的json對(duì)象格式

3.生命周期

在數(shù)據(jù)存儲(chǔ)的時(shí)效性上，localStorage并不會(huì)像cookie那樣可以設(shè)置數(shù)據(jù)存活的時(shí)限。也就是說，只要用戶不主動(dòng)刪除，localStorage存儲(chǔ)的數(shù)據(jù)將會(huì)永久存在。

sessionStorage生命周期為當(dāng)前窗口或標(biāo)簽頁，一旦窗口或標(biāo)簽頁被永久關(guān)閉了，那么所有通過sessionStorage存儲(chǔ)的數(shù)據(jù)也就被清空了。

4.存儲(chǔ)位置

不同瀏覽器無法共享localStorage或sessionStorage中的信息。相同瀏覽器的不同頁面間可以共享相同的localStorage（頁面屬于相同域名和端口），但是不同頁面或標(biāo)簽頁間無法共享sessionStorage的信息。這里需要注意的是，頁面及標(biāo)簽頁僅指頂級(jí)窗口，如果一個(gè)標(biāo)簽頁包含多個(gè)iframe標(biāo)簽且他們屬于同源頁面，那么他們之間是可以共享sessionStorage的。

5.存儲(chǔ)大小

對(duì)于HTML5的localStorage而言，其大小支持為5M（當(dāng)然，各瀏覽器的大小差異還是有的）。對(duì)于IE的userData，用戶數(shù)據(jù)的每個(gè)域最大為64KB。

6.應(yīng)用場(chǎng)景

建議不要使用localStorage方式存儲(chǔ)敏感信息，哪怕這些信息進(jìn)行過加密。另外，對(duì)身份驗(yàn)證數(shù)據(jù)使用localStorage進(jìn)行存儲(chǔ)還不太成熟。我們知道，通常可以通過xss漏洞來獲取到Cookie，然后用這個(gè)Cookie進(jìn)行身份驗(yàn)證登錄，但是瀏覽器可以通過HttpOnly來保護(hù)Cookie不被XSS攻擊獲取到。而localStorage存儲(chǔ)沒有對(duì)XSS攻擊有任何防御機(jī)制，一旦出現(xiàn)XSS漏洞，那么存儲(chǔ)在localStorage里的數(shù)據(jù)就極易被獲取到。

7.storage事件

當(dāng)存儲(chǔ)的storage數(shù)據(jù)發(fā)生變化時(shí)都會(huì)觸發(fā)它，但是它不同于click類的事件會(huì)冒泡和能取消，storage改變的時(shí)候，觸發(fā)這個(gè)事件會(huì)調(diào)用所有同域下其他窗口的storage事件，不過它本身觸發(fā)storage即當(dāng)前窗口是不會(huì)觸發(fā)這個(gè)事件的（當(dāng)然ie這個(gè)特例除外，它包含自己本事也會(huì)觸發(fā)storage事件）。

在使用 Storage 進(jìn)行存取操作的同時(shí)，如果需要對(duì)存取操作進(jìn)行監(jiān)聽，可以使用 HTML5 Web Storage api 內(nèi)置的事件監(jiān)聽器對(duì)數(shù)據(jù)進(jìn)行監(jiān)控。只要 Storage 存儲(chǔ)的數(shù)據(jù)有任何變動(dòng)，Storage 監(jiān)聽器都能捕獲。

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/107647.html

相關(guān)文章

  • JavaScript學(xué)習(xí)篇--本地存儲(chǔ)

    摘要：本地存儲(chǔ)的方案?jìng)鹘y(tǒng)把信息存儲(chǔ)到客戶端的瀏覽器中但是項(xiàng)目服務(wù)器端也是可以獲取的把信息存儲(chǔ)到服務(wù)器上的服務(wù)器存儲(chǔ)永久存儲(chǔ)在客服端的本地。 在客戶端運(yùn)行的js是不能操作用戶電腦磁盤中的文件的（這是為了保護(hù)客戶端運(yùn)行的安全）。 1、js中的本地存儲(chǔ)： 使用js向?yàn)g覽器的某一個(gè)位置中存儲(chǔ)一些內(nèi)容，瀏覽器即使關(guān)閉了，存儲(chǔ)的信息也不會(huì)銷毀，當(dāng)在重新打開瀏覽器的時(shí)候我們依然可以獲取到上一次存儲(chǔ)的信息。...

    hss01248 評(píng)論0 收藏0

  • Cookie、Session和LocalStorage

    摘要：通常，它用于告知服務(wù)端兩個(gè)請(qǐng)求是否來自同一瀏覽器，如保持用戶的登錄狀態(tài)。使基于無狀態(tài)的協(xié)議記錄穩(wěn)定的狀態(tài)信息成為了可能。標(biāo)記為的只應(yīng)通過被協(xié)議加密過的請(qǐng)求發(fā)送給服務(wù)端。 前記 前面我已經(jīng)寫了一篇關(guān)于Cookie的文章，但是那時(shí)候我其實(shí)理解的并不是很深刻，會(huì)有些搞不懂的地方，今天我就再寫一次，博客也是我的學(xué)習(xí)筆記 Cookie Cookie是服務(wù)器發(fā)送到用戶瀏覽器并保存在本地的一小塊數(shù)據(jù)...

    DesGemini 評(píng)論0 收藏0

  • 印象最深的一個(gè)bug：sessionStorage緩存在移動(dòng)端失效

    摘要：移動(dòng)端緩存失效是我印象最深的一個(gè)之一，為啥呢，因?yàn)檫@個(gè)問題導(dǎo)致我加班到很晚。的生命周期是僅在當(dāng)前會(huì)話下有效。引入了一個(gè)瀏覽器窗口的概念，是在同源的窗口中始終存在的數(shù)據(jù)。無bug，不程序：作為程序員的我，不是修bug就是在寫bug的路上?！　∫苿?dòng)端sessionStorage緩存失效是我印象最深的一個(gè)bug之一，為啥呢，因?yàn)檫@個(gè)問題導(dǎo)致我加班到很晚。在現(xiàn)在看來就是一個(gè)簡(jiǎn)單的概念問題。在我剛工作...

    yuxue 評(píng)論0 收藏0

  • 給localStorage加上過期時(shí)間

    摘要：定時(shí)器時(shí)間到了就將中存的信息以及存的時(shí)間信息就是那個(gè)對(duì)象中的刪掉就行了。難道存了三條我就做三個(gè)定時(shí)器存的條我就做個(gè)定時(shí)器這也太了而且也并不符合實(shí)際。 一、酷酷的開頭 在潛水的時(shí)間長達(dá)一年之后，我終于鼓起勇氣開始寫我的第一篇文章了。前端小菜，只是想記錄一下自己的想法，望各位看到這文的大佬輕噴。 在現(xiàn)在前后端分離的開發(fā)模式下，存儲(chǔ)信息一般都不在使用以往使用的cookie了，就拿筆主我之前做...

    davidac 評(píng)論0 收藏0

  • 關(guān)于localStorage面試的那點(diǎn)事

    摘要：已經(jīng)超出本地存儲(chǔ)限定大小可進(jìn)行超出限定大小之后的操作，如下面可以先清除記錄，再次保存面試官一波素質(zhì)三連對(duì)于只是會(huì)使用的同學(xué)來說，肯定是不得其解的。 最近面試的時(shí)候關(guān)于html5API總會(huì)被問到localStorage的問題， 對(duì)于一般的問題很簡(jiǎn)單，無非就是 localStorage、sessionStorage和cookie這三個(gè)客戶端緩存的區(qū)別 localStorage的API，g...

    timger 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<