簡單理解JS中的本地儲存

2021-10-06 16:42:46 字數 1751 閱讀 8712

1、資料儲存在使用者瀏覽器中

2、設定、讀取方便、甚至頁面重新整理不丟失資料

3、容量較大,sessionstorage約5m,localstorage約20m

4、只能儲存字串,可以將物件json.stringify()編碼後儲存

生命週期為關閉瀏覽器視窗

在同一視窗(頁面)下資料可以共享

以鍵值對的形式儲存

1、儲存資料

sessionstorage.

setitem

('key'

,value)

;

2、獲取資料

sessionstorage.

getitem

('key'

);

3、刪除資料

sessionstorage.

removeitem

('key'

);

4、刪除所有資料(清空資料)

sessionstorage.

clear()

;

生命週期永久生效,除非手動刪除 否則關閉頁面也會存在

可以多視窗(頁面)共享(同一瀏覽器可以共享)

以鍵值對的形式儲存使用

1、儲存資料

localstorage.

setitem

('key'

,value)

;

2、獲取資料

localstorage.

getitem

('key'

);

3、刪除資料

localstorage.

removeitem

('key'

);

4、刪除所有資料

localstorage.

clear()

;

<

!doctype html>

"en"

>

"utf-8"

>

"viewport" content=

"width=device-width, initial-scale=1.0"

>

document<

/title>

<

/head>

"text" id=

"username"

>

"checkbox" name=

"" id=

"remember"

>記住我

var username = document.

queryselector

('#username');

var remember = document.

queryselector

('#remember');

if(localstorage.

getitem

('username'))

remember.

addeventlistener

('change'

,function()

else})

<

/script>

<

/body>

<

/html>

JS 本地儲存

隨著網際網路的快速發展,基於網頁的應用越來越普遍,同時也變的越來越複雜,為了滿足各種各樣的需求,會經常性在本地儲存大量的資料,html5規範提出了相關解決方案。1 資料儲存在使用者瀏覽器中 2 設定 讀取方便 甚至頁面重新整理不丟失資料 3 容量較大,sessionstorage約5m locals...

js 本地儲存 物件儲存

使用getitem 和setitem 來取資料和存資料 localstorage.setitem data item 設定data為 item localstorage.getitem data 獲取data的值 html5還提供了乙個key 方法,可以在不知道有哪些鍵值的時候使用var stora...

js本地儲存詳解

各種儲存方案 cookies 瀏覽器均支援,容量為4kb localstorage html5,容量為5m sessionstorage html5,容量為5m userdata 僅ie支援,容量為64kb flash 100kb,非html原生,需要外掛程式支援 google gears sqli...