HTML5 storage事件監聽
引用《h5移動web開發指南》上的話：
“當同源頁面的某個頁面修改了localStorage,其餘的同源頁面只要註冊了storage事件，就會觸發”
所以，localStorage storage的例子執行需要如下條件：
同一瀏覽器打開了兩個同源頁面
其中一個網頁修改了localStorage
另一網頁註冊了storage事件
Storage事件
在某些複雜情況下，如果多個頁面都需要訪問本地儲存的資料，就需要在儲存區域的內容發生改變時，能夠通知相關的頁面。
Web Storage API內建了一套事件通知機制，當儲存區域的內容發生改變（包括增加、修改、刪除資料）時，就會自動觸發 storage 事件，並把它傳送給所有感興趣的監聽者。因此，如果需要跟蹤儲存區域的改變，就需要在關心儲存區域內容的頁面監聽 storage 事件。
所有支援 localStorage 的瀏覽器都支援 storage 事件，包括 IE8。但IE 8不支援 W3C 標準的 addEventListener。因此，為了監聽 storage 事件，還需要檢測瀏覽器支援哪種事件機制：
if (window.addEventListener) {
window.addEventListener("storage", handleStorage, false);
} else {
window.attachEvent("onstorage", handleStorage);
}
handleStorage 回撥函式接受一個 StorageEvent 引數，在IE中，StorageEvent物件儲存在 window.event 裡面。
function handleStorage(e) {
if (!e) {
e = window.event;
}
}
此時，變數 e 就是一個 StorageEvent 物件，這個物件有很多有用的屬性。這些屬性及含義見表：
表 StorageEvent物件的屬性及含義
屬性 含義
key 設定或刪除或修改的鍵。呼叫clear()時，則為null。
oldValue 改變之前的舊值。如果是新增元素，則為null。
newValue 改變之後的新值。如果是刪除元素，則為null。
storageArea 該屬性是一個引用，指向發生變化的sessionStorage或localStorage物件
url 觸發這個改變事件的頁面的URL
得到這些屬性之後，就可以做任何想做的事情。接下來，通過一個完整的例項，來演示一下 localStorage 的 storage 事件機制。
假設有 save.html 和 show.html 兩個頁面，在 save 頁面觸發資料改變，在 show 頁面通過彈窗將相關資訊顯示出來。
在 save 頁面中，有一個文字框和一個儲存按鈕，使用者在文字框中輸入資料後，點選儲存按鈕，就會呼叫 saveItem() 函式將使用者的輸入儲存到本地儲存中。程式碼如下：
<input type="text" id="data" placeholder="input date to save">
<button onClick="saveItem()">儲存</button>
<script>
function saveItem() {
var data = document.getElementById("data").value;
localStorage.setItem("data", data);
}
</script>
在 show 頁面中，註冊事件監聽函式，來監聽 storage 事件，因為它關心儲存區域內容的變化：
<script>
if (window.addEventListener) {
window.addEventListener("storage", showStorage);
} else {
window.attachEvent("onstorage", showStorage);
}
function showStorage(e) {
if (!e) {
e = window.event;
}
var str = "key: " + e.key +
"\nnewValue: " + e.newValue +
"\noldValue: " + e.oldValue +
"\nurl: " + e.url +
"\nstorageArea: " + e.storageArea;
alert(str);
}
</script>
此時，如果 save 頁面改變了儲存區域的內容，就會自動觸發 storage 事件，並把它傳送給所有監聽 storage 事件的頁面。
需要注意的是，只有在資料的內容確實發生改變的時候，才會觸發 storage 事件。如果把一個值設定成一模一樣的值，或刪除一個根本就不存在的儲存項，則不會觸發 storage 事件。並且，storage 事件只會傳送給同源、而且處於開啟狀態的其它頁面，而不會發送給觸發改變的頁面本身（即 save.html）及處於關閉狀態的頁面。因此，應當從Web伺服器上獲取本例項的頁面。
&n