HTML5 LocalStorage 本地儲存

2022-09-13 05:39:07 字數 1128 閱讀 7758

1.前言

html5 storage提供了一種方式讓**能夠把資訊儲存到你本地的計算機上,並再以後需要的時候進行獲取。這個概念和cookie相似,區別是它是為了更大容量儲存設計的。cookie的大小是受限的,並且每次你請求乙個新的頁面的時候cookie都會被傳送過去。html5的storage是儲存在你的計算機上,**在頁面載入完畢後可以通過j**ascript來獲取這些資料。首先自然是檢測瀏覽器是否支援本地儲存。在html5中,本地儲存是乙個window的屬性,包括localstorage和sessionstorage,從名字應該可以很清楚的辨認二者的區別,前者是一直存在本地的,後者只是伴隨著session,標籤或瀏覽器視窗一旦關閉就沒了(複製標籤可以共享,開新標籤無法共享)。二者用法完全相同,這裡以localstorage為例。

if(window.localstorage)else

2.基本用法

儲存資料的方法就是直接給window.localstorage新增乙個屬性,例如:window.localstorage.a 或者 window.localstorage["a"]。它的讀取、寫、刪除操作方法很簡單,是以鍵值對的方式存在的,如下:

localstorage.name = "kobi";//設定name為"kobi"

localstorage["name"] = "koko";//設定name為"koko",覆蓋上面的值

localstorage.setitem("age","18");//設定age為"18"

var a1 = localstorage["name"];//獲取name的值

var a2 = localstorage.age;//獲取age的值

var b = localstorage.getitem("name");//獲取name的值

localstorage.removeitem("c");//清除c的值

這裡最推薦使用的自然是getitem()和setitem(),清除鍵值對使用removeitem()。如果希望一次性清除所有的鍵值對,可以使用clear()。另外,html5還提供了乙個key()方法,可以在不知道有哪些鍵值的時候使用,如下:

var storage = window.localstorage;

function showstorage()

}

HTML5的本地儲存 LocalStorage

localstorage顧名思義,就是本地儲存的意思,在以前很長一段時間,要想在客戶端存 儲一些配置及登入資訊等資料都只能通過cookie或flash的方式,如今html5來臨,也 帶來了更強大的本地儲存,最多可儲存大小5m的字串,足可以滿足大部分的web應 用,比cookie的4k要大出不少,還有...

Html5本地儲存之Localstorage

在html5中,本地儲存是乙個window的屬性,包括localstorage和sessionstorage,前者是一直存在本地的,後者只是伴隨著session,視窗一旦關閉就沒了。localstorage可以簡單理解為小型資料庫。其大小官方給出的文件是 每個網域名稱5m 其儲存時間是 永久儲存,永...

html5介紹,什麼是html5,html5新特性

html5 將成為 html xhtml 以及 html dom 的新標準。html 的上乙個版本誕生於 1999 年。自從那以後,web 世界已經經歷了巨變。html5 仍處於完善之中。然而,大部分現代瀏覽器已經具備了某些 html5 支援。html5 是 w3c 與 whatwg 合作的結果。編...