html5中web儲存的概念是什么

這篇文章主要介紹了html5中web儲存的概念是什么的相關知識，內容詳細易懂，操作簡單快捷，具有一定借鑒價值，相信大家閱讀完這篇html5中web儲存的概念是什么文章都會有所收獲，下面我們一起來看看吧。

html5中web儲存的含義是讓網頁在用戶計算機上保存一些信息，使用HTML5可以在本地存儲用戶的瀏覽數據；web儲存又可以分為本地存儲和會話存儲，分別對應localStorage對象和sessionStorage對象；本地存儲用于長期保存網站的數據，會話存儲用于臨時保存針對一個窗口的數據。

本教程操作環境：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());

關于“html5中web儲存的概念是什么”這篇文章的內容就介紹到這里，感謝各位的閱讀！相信大家對“html5中web儲存的概念是什么”知識都有一定的了解，大家如果還想學習更多知識，歡迎關注億速云行業資訊頻道。