南通網站設計公司天卓詳解HTML 5 在客戶端存儲

HTML 5 Web 存儲

在客戶端存儲數據

HTML 5 提供了兩種在客戶端存儲數據的新方法： localStorage - 沒有時間限制的數據存儲sessionStorage - 針對一個 session 的數據存儲

之前，這些都是由 cookie 完成的。但是 cookie 不適合大量數據的存儲，因為它們由每個對服務器的請求來傳遞，這使得 cookie 速度很慢而且效率也不高。

在 HTML 5 中，數據不是由每個服務器請求傳遞的，而是只有在請求時使用數據。它使在不影響網站性能的情況下存儲大量數據成為可能。

對于不同的網站，數據存儲于不同的區域，并且一個網站只能訪問其自身的數據。

HTML 5 使用 JavaScript 來存儲和訪問數據。

localStorage 方法

localStorage 方法存儲的數據沒有時間限制。第二天、第二周或下一年之后，數據依然可用。如何創建和訪問 localStorage：

實例

親自試一試吧，代碼如下：

下面的例子對用戶訪問頁面的次數進行計數： 實例

親自試一試吧，代碼如下：

sessionStorage 方法

sessionStorage 方法針對一個 session 進行數據存儲。當用戶關閉瀏覽器窗口后，數據會被刪除。

如何創建并訪問一個 sessionStorage： 實例

親自試一試吧，代碼如下：

刷新頁面會看到計數器在增長。

請關閉瀏覽器窗口，然后再試一次，計數器會繼續計數。

下面的例子對用戶在當前 session 中訪問頁面的次數進行計數： 實例

親自試一試吧，代碼如下：

刷新頁面會看到計數器在增長。

請關閉瀏覽器窗口，然后再試一次，計數器已經重置了。