IE userData

前面的話

　　IE瀏覽器實現了它專屬的客戶端存儲機制——“userData”。userData可以實現一定量的字符串數據存儲，可以將其用做是Web存儲的替代方案。本文將詳細介紹IE userData

 

概述

　　在IE5.0中，微軟通過一個自定義行為引入了持久化用戶數據的概念。用戶數據允許每個文檔最多128KB數據，每個域名最多1MB數據

　　[注意]IE9+瀏覽器不支持

　　要使用持久化用戶數據，首先必須如下所示，使用CSS在某個元素上指定userData行為

<div style="behavior:url(#default#userData)" id="dataStore"></div>

　　或者使用動態生成元素的方式

var memory = document.createElement("div");    // 創建一個元素
memory.id = "_memory";    // 設定一個id名
memory.style.display = "none";    // 將其隱藏
memory.style.behavior = "url('#default#userData')";//附加userData行為 document.body.appendChild(memory);    // 將其添加到document元素中

 

保存數據

　　一旦該元素使用了userData行為，那么就可以使用setAttribute()方法在上面保存數據了。為了將數據提交到瀏覽器緩存中，還必須調用save()方法並告訴它要保存到的數據空間的名字。數據空間名字可以完全任意，僅用於區分不同的數據集

var dataStore = document.getElementById("dataStore");
dataStore.setAttribute("name", "Nicholas");
dataStore.setAttribute("book", "Professional JavaScript");
dataStore.save("BookInfo");

　　在這段代碼中，<div>元素上存入了兩部分信息。在用setAttribute()存儲了數據之后，調用了save()方法，指定了數據空間的名稱為BookInfo

 

讀取數據

　　load()方法用於載入存儲的數據。使用它的時候必須傳遞一個字符串作為參數——類似於一個文件名，該參數用來指定要載入的存儲數據。當數據載入后，就可以通過該元素的屬性來訪問這些名/值對形式的數據，可以使用getAttribute()來査詢這些數據，如下所示

dataStore.load("BookInfo")；
console.log(dataStore.getAttribute("name"));//"Nicholas"
console.log(dataStore.getAttribute("book"));//"Professional JavaScript"

　　對load()的調用獲取了BookInfo數據空間中的所有信息，並且使數據可以通過元素訪問；只有到載入確切完成之后數據方能使用。如果getAttribute()調用了不存在的名稱或者是尚未載入的名稱，則返回null

　　[注意]IE11瀏覽器報錯，IE9、10瀏覽器返回null

 

刪除數據

　　可以通過removeAttribute()方法明確指定要刪除某元素數據，只要指定屬性名稱。刪除之后，必須像下面這樣再次調用save()來提交更改

dataStore.removeAttribute("name");
dataStore.removeAttribute("book");
dataStore.save("BookInfo");

　　這段代碼刪除了兩個數據屬性，然后將更改保存到緩存中

 

有效期

　　默認情況下，通過userData存儲的數據，除非手動去刪除它否則永不失效。但是，也可以通過設置expires屬性來指定它的過期時間。比如，可以給存儲的數據設置時長100天的有效期，如下所示：

var now = (new Date()).getTime();
var expires = now + 100 * 24 * 60 * 60 * 1000;
expires = new Date(expires).toUTCString();
memory.expires = expires;

　　IE userData的作用域限制在和當前文檔同目錄的文檔中。作用域沒有cookie寬泛，cookie對其所在目錄下的子目錄也有效。userData的機制並沒有像cookie那樣，通過設置path和domain屬性來控制或者改變其作用域的方式

　　userData允許存儲的數據量要比cookie大，但是卻比localStorage以及sessionStorage允許存儲的數據量要小

 

最后

　　由於上述代碼只在IE瀏覽器下有效，最好使用IE條件注釋來避免其他瀏覽器載入上述代碼

<!--[if IE]>

<![endif]-->