web 本地存儲 (localStorage、sessionStorage)

web 本地存儲 (localStorage、sessionStorage,cookie)

  1. localStorage(長期儲存):即便關閉瀏覽器數據也不會刪除,除非使用localStorage.clear()去清掉數據。

  2. sessionStorage(臨時存儲):數據保存在當前瀏覽器中,瀏覽器關閉數據也隨之消失。

  3. cookie:是一些數據, 存儲於你電腦上的文本文件中。當 web 服務器向瀏覽器發送 web 頁面時,在鏈接關閉後,服務端不會記錄用戶的信息。

sessionStorage 和 localStorage 的用法基本一致,引用類型的值要轉換成JSON

1. 保存數據到本地

var info = {
        name: 'Lee',
        age: 20,
        id: '001'
    };
sessionStorage.setItem('key', JSON.stringify(info));
localStorage.setItem('key', JSON.stringify(info));

2. 從本地存儲獲取數據

 getItem(「key」):獲取名稱爲key的值,若是key不存在則返回nullweb

   var data1 = JSON.parse(sessionStorage.getItem('key'));
   var data2 = JSON.parse(localStorage.getItem('key'));

3. 本地存儲中刪除某個保存的數據

1 sessionStorage.removeItem('key');
2 localStorage.removeItem('key');

4. 刪除全部保存的數據

1 sessionStorage.clear();
2 localStorage.clear();

5. js下cookie使用方法

能夠爲 cookie 添加一個過時時間(以 UTC 或 GMT 時間)。默認狀況下,cookie 在瀏覽器關閉時刪除。瀏覽器

JavaScript 能夠使用 document.cookie 屬性來建立 、讀取、及刪除 cookie。服務器

建立cookie:cookie

1 document.cookie="name=tom";<br><br>可爲cookie添加一個過時時間:<br>document.cookie="name=tom; expires=Thu, 26 Dec 2017 12:00:00 GMT";

讀取cookie:session

1 var co = document.cookie;  // 以字符串的方式返回全部的 cookie

 

刪除cookie:工具

1 document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";

刪除cookie只須要將expires的值設爲當前時間以前就好了,刪除是沒必要指定cookie的值。spa

6. jq下cookie使用方法

使用該方法,須要先引入jQuery文件與jQuery.cookie文件code

建立cookie:blog

1 $.cookie('key','value')  //  注:當沒有指明 cookie有效時間時,所建立的cookie有效期默認到用戶關閉瀏覽器爲止

建立一個具備有效期的cookie:ip

1 $.cookie('name', 'value', { expires: 10 });

讀取cookie:

1 $.cookie('name')  // cookie存在,值爲'value',不存在,則爲null

刪除cookie:

1 $.cookie('name',null)

瀏覽器查看方法

  • 進入開發者工具
  • 選擇 Application
  • 在左側 Storage 下 查看 Local Storage 和 Session Storage

2018-07-2117:57:27

相關文章
相關標籤/搜索