html5中的web儲存就是sessionstorage和localstorage,使用非常非常簡單
localstorage.fry_videojs_playbackrate=this.playbackrate();sessionstorage:【關閉瀏覽器視窗】:容量大小約為5m左右,該方式的生命週期為關閉瀏覽器視窗為止
localstorage:【不刪除不過期】:容量大小約為20m左右, 儲存的資料不會隨著使用者瀏覽時會話過期而過期,但會應使用者的請求而刪除。【只能儲存字串】:如果是json物件的話,可以將物件json.stringify() 編碼後儲存**或參考:html5的web儲存詳解
以前我們在本地儲存資料都是用document.cookie來儲存的,但是由於其的儲存大小只有4k左右,解析也很複雜,給開發帶來了諸多的不便.不過現在html5出了web的儲存,彌補了cookie的不足,而且開放起來也是相當的方便
web儲存分兩類
sessionstorage
容量大小約為5m左右,該方式的生命週期為關閉瀏覽器視窗為止
localstorage
容量大小約為20m左右, 儲存的資料不會隨著使用者瀏覽時會話過期而過期,但會應使用者的請求而刪除。瀏覽器也因為儲存空間的限制或安全原因刪除它們.而且型別儲存的資料可以同乙個瀏覽器的多個視窗共享
注意點:只能儲存字串,如果是json物件的話,可以將物件json.stringify() 編碼後儲存
方法詳解:
setitem(key, value) 設定儲存內容
getitem(key) 讀取儲存內容
removeitem(key) 刪除鍵值為
key的儲存內容
clear() 清空所有儲存內容
下面我們就給個給大家看一下他的寫法:
//檢視效果的話,我們以谷歌瀏覽器為例子:更新function
update()
//獲取
function
get()
//刪除
function
remove()
//清空所有資料
function
clear()
儲存完資料後的
下面我就給大家展示記錄使用者名稱和密碼的經典例子
當記住密碼的核取方塊勾上的時候,下次開啟的時候,使用者名稱和密碼就不需要在重新輸入了
html部分:
使用者名稱:
密 碼:
記住密碼
登入js部分
var username=document.queryselector('.username');var pwd=document.queryselector('.pwd');
var sub=document.queryselector('button');
var ckb=document.queryselector('.ckb');
sub.onclick=function
()else
//否則清除使用者資訊
} window.onload=function
()
html5中web儲存方式
瀏覽器 客戶端 訪問伺服器端的時候,攜帶的資料,之前這些資料儲存在cookie中,但是cookie儲存的資料大小有限 html5的web儲存分為 localstorage儲存 sessionstorage儲存 他們的區別在於 localstorage 儲存在客戶端,大小沒有限制,時間也沒有限制 se...
HTML5 中Web儲存問題
html5 web 儲存,乙個比cookie更好的本地儲存方式。注意 internet explorer 7 及更早ie版本不支援web 儲存.使用html5可以在本地儲存使用者的瀏覽資料。早些時候,本地儲存使用的是 cookie。但是web 儲存需要更加的安全與快速.這些資料不會被儲存在伺服器上,...
HTML5的Web儲存應用
一 介紹 html5 web儲存,乙個比cookie更好的本地儲存方式。1 什麼是html5 web儲存 使用html5可以在本地儲存使用者的瀏覽資料。早些時候,本地儲存使用的是cookie。但是web儲存需要更加的安全與快速,這些資料不會被儲存在伺服器上,但是這些資料只用於使用者請求 資料上,它也...