首頁 > web前端 > 前端問答 > html5中web儲存的意思是什麼

html5中web儲存的意思是什麼

WBOY
發布: 2022-06-20 10:16:41
原創
2337 人瀏覽過

html5中web儲存的含義是讓網頁在用戶計算機上保存一些信息,使用HTML5可以在本地存儲用戶的瀏覽數據;web儲存又可以分為本地存儲和會話存儲,分別對應localStorage對象和sessionStorage物件;本地儲存用於長期保存網站的數據,會話儲存用於暫時保存針對一個視窗的資料。

html5中web儲存的意思是什麼

本教學操作環境:windows10系統、HTML5版本、Dell G3電腦。

html5中web儲存的意義是什麼

HTML5的Web儲存功能是讓網頁在使用者電腦上保存一些資訊。使用HTML5可以在本地儲存用戶的瀏覽資料。

早些時候,本地儲存使用的是cookies。但是Web 儲存需要更加的安全與快速. 這些數據不會被保存在伺服器上,但是這些數據只用於用戶請求網站數據上.它也可以儲存大量的數據,而不影響網站的效能。

資料以鍵/值對存在, web網頁的資料只允許該網頁存取使用。

Web儲存又分為兩種:

(1)本地存儲,對應 localStorage物件。用於長期保存網站的數據,且站內任何頁面都可以存取該數據。

(2)會話存儲,對應 sessionStorage物件。用於暫時保存針對一個視窗(或標籤頁)的資料。在訪客關閉視窗或標籤頁之前,這些資料是存在的,而關閉之後就會被瀏覽器刪除。

本機儲存與會話儲存的異同

(1)本機儲存和會話儲存的操作碼完全相同,它們的差異僅在於資料的壽命。

(2)本地儲存主要用來保存訪客將來還能看到的資料。

(3)會話儲存則用於保存那些需要從一個頁面傳遞給下一個頁面的資料。

Web儲存容量限制

大多數瀏覽器都把本機儲存限制在 5MB以下。這個是和網站所在的網域連結在一起的。

Web儲存的使用範例

#下面以本機儲存(localStorage)為例,會話儲存改成 sessionStorage物件即可。

(1)文字資料的儲存與讀取localStorage.setItem("user_name","hangge.com");

var userName = localStorage.getItem("user_name");
登入後複製

(2)數值的儲存與讀取localStorage.setItem ("user_age",100);

var userAge = Number(localStorage.getItem("user_age"));
登入後複製

(3)日期的保存與讀取//建立日期物件

var today = new Date();
//按照YYY/MM/DD的标准格式把日期转换成文本字符串,然后保存为文本
var todayString = today.getFullYear() + "/" + today.getMonth() + "/" + today.getDate();
localStorage.setItem("session_started", todayString);
//取得日期文本,并基于该文本创建新的日期对象
var newToday = new Date(localStorage.getItem("session_started"));
alert(newToday.getFullYear());
登入後複製

(學習影片分享:css影片教學# 、html影片教學

以上是html5中web儲存的意思是什麼的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板