HTML5存儲設置 HTML5引入了許多新的特性，其中之一是瀏覽器本地存儲。HTML5存儲API使得網頁能夠在用戶的計算機或手持設備上存儲和檢索數據。本文將介紹HTML5存儲API的兩種主要類型：本地存儲和會話存儲。 ## 本地存儲 本地存儲允許在用戶的計算機上存儲數據，即使瀏覽器已經關閉或用戶已經離開網站。本地存儲是通過localStorage對象實現的，在JavaScript中使用。 下面是一個使用localStorage對象存儲數據的示例：

localStorage.setItem("username", "John");
localStorage.setItem("email", "john@example.com");

在上面的示例中，我們使用setItem()函數將用戶名和電子郵件地址存儲在本地存儲中。可以使用getItem()函數檢索這些值：

var username = localStorage.getItem("username");
var email = localStorage.getItem("email");

在上面的示例中，我們使用getItem()函數檢索本地存儲中的數據，并將其存儲在變量中。還可以使用removeItem()函數從本地存儲中刪除數據：

localStorage.removeItem("username");

在上面的示例中，我們使用removeItem()函數從本地存儲中刪除用戶名。 ## 會話存儲 會話存儲是一種在用戶會話期間存儲數據的方式。會話存儲使用sessionStorage對象。與本地存儲不同，會話存儲只在用戶會話期間存儲數據，并且當用戶關閉瀏覽器或離開網站時，這些數據就會被刪除。 下面是一個使用sessionStorage對象存儲數據的示例：

sessionStorage.setItem("cart", "iPhone");

在上面的示例中，我們使用setItem()函數將iPhone添加到會話存儲中。可以使用getItem()函數檢索這些值：

var cart = sessionStorage.getItem("cart");

在上面的示例中，我們使用getItem()函數檢索會話存儲中的數據，并將其存儲在變量中。還可以使用removeItem()函數從會話存儲中刪除數據：

sessionStorage.removeItem("cart");

在上面的示例中，我們使用removeItem()函數從會話存儲中刪除購物車。 總結 HTML5存儲API允許開發人員在用戶的計算機或手持設備上存儲和檢索數據。本地存儲和會話存儲是HTML5存儲API的兩種主要類型。使用localStorage對象可以在用戶計算機上存儲數據，使用sessionStorage對象可以將數據存儲在用戶會話期間。無論您選擇哪種類型的存儲，都能更好地控制您的網站數據，改善用戶體驗。