1. 程式人生 > 實用技巧 >html5中localStorage與sessionStorage的相同點與區別

html5中localStorage與sessionStorage的相同點與區別

  只讀的localStorage屬性允許你訪問一個Document源(origin)的物件Storage;儲存的資料將儲存在瀏覽器會話中localStorage類似sessionStorage,但其區別在於:儲存在localStorage的資料可以長期保留;而當頁面會話結束——也就是說,當頁面被關閉時,儲存在sessionStorage的資料會被清除。

  應注意,無論資料儲存在localStorage還是sessionStorage它們都特定於頁面的協議。(同源策略)

  另外,localStorage中的鍵值對總是以字串的形式儲存。 (需要注意, 和js物件相比, 鍵值對總是以字串的形式儲存意味著數值型別會自動轉化為字串型別).

1、相同點

  localStorage和sessionStorage都是用來儲存客戶端臨時資訊的物件。它們目前均只能儲存字串型別的物件。

2、不同點

  A.localStorage生命週期是永久,除非使用者清除localStorage資訊,否則這些資訊將永遠存在。

  B.sessionStorage生命週期為當前視窗或標籤頁,一旦視窗或標籤頁被永久關閉了,那麼所有通過sessionStorage儲存的資料也就被清空了。

  C.不同瀏覽器無法共享localStorage或sessionStorage中的資訊。

  D.相同瀏覽器的不同源頁面間可以共享相同的 localStorage,但是不同頁面或標籤頁間無法共享sessionStorage的資訊。

  E.非頂級視窗中,如果一個標籤頁包含多個iframe標籤且它們屬於同源頁面,那麼它們可以共享sessionStorage。

3、操作方法:

  設定:setItem

  獲取:getItem

  刪除:removeItem

  清空全部:clear

友情提示:可以通過JSON物件提供的parse和stringify將其他資料型別轉化成字串,再儲存到storage中。
操作的方式:

存:

var obj = {"name":"zhangsan","age":"18"}

localStorage.setItem("userInfo",JSON.stringify(obj));

取:

var user = JSON.parse(localStorage.getItem("userInfo"))

刪除:localStorage.remove("userInfo);

清空:localStorage.clear();