請描述一下 cookies,sessionStorage 和 localStorage 的區別?


http://handyxuefeng.blog.163.com/blog/static/454521722013111714040259/

http://book.51cto.com/art/201106/270499.htm

http://www.cnblogs.com/blackbird/archive/2012/06/18/2553718.html

軟件編程希望通過一些手段來持久化的存儲一些有用的數據。對於網絡化編程,一般將這項任務交給了服務器端的數據庫或者瀏覽器端的cookie。隨着HTML5的出現,web開發又有了兩種選擇:Web Storage和Web SQL Database.

Web Storage有兩種形式:LocalStorage(本地存儲)和sessionStorage(會話存儲)。這兩種方式都允許開發者使用js設置的鍵值對進行操作,在在重新加載不同的頁面的時候讀出它們。這一點與cookie類似。

1.與cookie不同的是:Web Storage數據完全存儲在客戶端,不需要通過瀏覽器的請求將數據傳給服務器,因此x相比cookie來說能夠存儲更多的數據,大概5M左右。

2.LocalStorage和sessionStorage功能上是一樣的,但是存儲持久時間不一樣。

    LocalStorage:瀏覽器關閉了數據仍然可以保存下來,並可用於所有同源(相同的域名、協議和端口)窗口(或標簽頁),

    sessionStorage:數據存儲在窗口對象中,窗口關閉后對應的窗口對象消失,存儲的數據也會丟失。

注意:sessionStorage 都可以用localStorage 來代替,但需要記住的是,在窗口或者標簽頁關閉時,使用sessionStorage 存儲的數據會丟失。

3、使用 local storage和session storage主要通過在js中操作這兩個對象來實現,分別為window.localStorage和window.sessionStorage. 這兩個對象均是Storage類的兩個實例,自然也具有Storage類的屬性和方法。

 

Storage類的相關成員如下:

成員名 方法參數 描述
length 屬性 獲取存儲數據的條數

key(n)    

n:索引值 根據索引值,返回鍵名
getItem(key) key:鍵名 根據鍵名,獲取數據值
setItem(key,value) key:鍵名 value:鍵值 根據鍵名和鍵值設置數據項,如果鍵名已經存在,則覆蓋值
removeItem(key) key:鍵名 根據鍵名刪除一個數據項
clear() 清空當前的Storage對象

其用法:

參數設置很簡單,如下例:

localStorage.setItem('age', 40); 

訪問一個存儲的數據一樣很容易:

 = .getItem('age'); 

可以這樣刪除一個特定的鍵值對:

localStorage.removeItem('age'); 

或者刪除所有的鍵值對:

localStorage.clear(); 

sessionStorage與頁面 js 數據對象的區別:

sessionStorage只要是同源的同窗口(Tab)中,刷新頁面或者進入不同的頁面數據對象仍然被保存,也就是說只要瀏覽器窗口不關閉,加載頁面(同源)或刷新頁面,數據仍存在。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM