HTML5 Web存儲(chǔ)

HTML5 Web存儲(chǔ)挽封,一個(gè)比cookie更好用的方法

什么是 HTML5 Web 存儲(chǔ)?

使用HTML5可以在本地存儲(chǔ)用戶的瀏覽數(shù)據(jù)。

早些時(shí)候,本地存儲(chǔ)使用的是 cookie渺鹦。但是Web 存儲(chǔ)需要更加的安全與快速. 這些數(shù)據(jù)不會(huì)被保存在服務(wù)器上,但是這些數(shù)據(jù)只用于用戶請(qǐng)求網(wǎng)站數(shù)據(jù)上.它也可以存儲(chǔ)大量的數(shù)據(jù),而不影響網(wǎng)站的性能.

數(shù)據(jù)以 鍵/值 對(duì)存在, web網(wǎng)頁(yè)的數(shù)據(jù)只允許該網(wǎng)頁(yè)訪問(wèn)使用痊夭。

瀏覽器支持

Internet Explorer 8+, Firefox, Opera, Chrome, 和 Safari支持Web 存儲(chǔ)。

注意:Internet Explorer 7 及更早IE版本不支持web 存儲(chǔ).

localStorage和sessionStorage

客戶端存儲(chǔ)數(shù)據(jù)的兩個(gè)對(duì)象為:

localStorage - 沒(méi)有時(shí)間限制的數(shù)據(jù)存儲(chǔ)

sessionStorage - 針對(duì)一個(gè)session的數(shù)據(jù)存儲(chǔ)

在使用web存儲(chǔ)前脏里,應(yīng)檢查瀏覽器是否支持localStorage和sessionStorage

if(typeof(Storage) !== "undefined"){ //支持的代碼?} else { //sorry她我,不支持?};

localStorage 對(duì)象

localStorage 對(duì)象存儲(chǔ)的數(shù)據(jù)沒(méi)有時(shí)間限制。第二天迫横、第二周或下一年之后番舆,數(shù)據(jù)依然可用。

實(shí)例:

localStorage.sitename="菜鳥(niǎo)教程";

document.getElementById("result").innerHTML="網(wǎng)站名:"+localStorage.sitename;

實(shí)例解析:

使用 key="sitename" 和 value="菜鳥(niǎo)教程" 創(chuàng)建一個(gè) localStorage 鍵/值對(duì)矾踱。

檢索鍵值為"sitename" 的值然后將數(shù)據(jù)插入 id="result"的元素中恨狈。

不管是localStorage,還是sessionStorage介返,可使用的API都相同拴事,常用的有如下幾個(gè)(以localStorage為例)

1沃斤、保存數(shù)據(jù) : localStorage.setItem(key,value);

2、讀取數(shù)據(jù) : localStorage.getItem(key);

3刃宵、刪除單個(gè)數(shù)據(jù) : localStorage.removeItem(key);

4衡瓶、刪除所有數(shù)據(jù) :localStorage.clear();

5、得到某個(gè)索引的key : localStorage.key(index);

sessionStorage對(duì)象

sessionStorage方法針對(duì)一個(gè)session進(jìn)行數(shù)據(jù)存儲(chǔ)牲证。當(dāng)用戶關(guān)閉瀏覽器窗口后哮针,數(shù)據(jù)會(huì)被刪除。

webstorage和cookie的區(qū)別

WebStorage的概念和cookie相似坦袍,區(qū)別是它是為了更大容量存儲(chǔ)設(shè)計(jì)的十厢。Cookie的大小是受限的,并且每次你請(qǐng)求一個(gè)新的頁(yè)面的時(shí)候Cookie都會(huì)被發(fā)送過(guò)去捂齐,這樣無(wú)形中浪費(fèi)了帶寬蛮放,另外cookie還需要指定作用域,不可以跨域調(diào)用奠宜。

除此之外包颁,WebStorage擁有setItem,getItem,removeItem,clear等方法,不像cookie需要前端開(kāi)發(fā)者自己封裝setCookie压真,getCookie娩嚼。但是Cookie也是不可以或缺的:Cookie的作用是與服務(wù)器進(jìn)行交互,作為HTTP規(guī)范的一部分而存在滴肿,而WebStorage僅僅是為了在本地“存儲(chǔ)”數(shù)據(jù)而生岳悟。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市泼差,隨后出現(xiàn)的幾起案子贵少,更是在濱河造成了極大的恐慌,老刑警劉巖堆缘,帶你破解...
    沈念sama閱讀 212,454評(píng)論 6 493
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件春瞬,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡套啤,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,553評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門随常,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)潜沦,“玉大人,你說(shuō)我怎么就攤上這事绪氛∷艏Γ” “怎么了?”我有些...
    開(kāi)封第一講書(shū)人閱讀 157,921評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵枣察,是天一觀的道長(zhǎng)争占。 經(jīng)常有香客問(wèn)我燃逻,道長(zhǎng),這世上最難降的妖魔是什么臂痕? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,648評(píng)論 1 284
  • 正文 為了忘掉前任伯襟,我火速辦了婚禮,結(jié)果婚禮上握童,老公的妹妹穿的比我還像新娘姆怪。我一直安慰自己,他們只是感情好澡绩,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,770評(píng)論 6 386
  • 文/花漫 我一把揭開(kāi)白布稽揭。 她就那樣靜靜地躺著,像睡著了一般肥卡。 火紅的嫁衣襯著肌膚如雪溪掀。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 49,950評(píng)論 1 291
  • 那天步鉴,我揣著相機(jī)與錄音揪胃,去河邊找鬼。 笑死唠叛,一個(gè)胖子當(dāng)著我的面吹牛只嚣,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播艺沼,決...
    沈念sama閱讀 39,090評(píng)論 3 410
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼册舞,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了障般?” 一聲冷哼從身側(cè)響起调鲸,我...
    開(kāi)封第一講書(shū)人閱讀 37,817評(píng)論 0 268
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎挽荡,沒(méi)想到半個(gè)月后藐石,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,275評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡定拟,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,592評(píng)論 2 327
  • 正文 我和宋清朗相戀三年于微,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片青自。...
    茶點(diǎn)故事閱讀 38,724評(píng)論 1 341
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡株依,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出延窜,到底是詐尸還是另有隱情恋腕,我是刑警寧澤,帶...
    沈念sama閱讀 34,409評(píng)論 4 333
  • 正文 年R本政府宣布逆瑞,位于F島的核電站荠藤,受9級(jí)特大地震影響伙单,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜哈肖,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 40,052評(píng)論 3 316
  • 文/蒙蒙 一吻育、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧牡彻,春花似錦扫沼、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,815評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至总寻,卻和暖如春器罐,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背渐行。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,043評(píng)論 1 266
  • 我被黑心中介騙來(lái)泰國(guó)打工轰坊, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人祟印。 一個(gè)月前我還...
    沈念sama閱讀 46,503評(píng)論 2 361
  • 正文 我出身青樓肴沫,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親蕴忆。 傳聞我的和親對(duì)象是個(gè)殘疾皇子颤芬,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,627評(píng)論 2 350

推薦閱讀更多精彩內(nèi)容