js 单页面及不同页面监听 storage 改变

同源不同页面

• 同一浏览器打开了两个同源页面
• 其中一个网页修改了localStorage
• 另一网页注册了storage事件

网页A：监听了storage事件：

window.addEventListener("storage", function (e) {
   alert(e.newValue);
});

网页B：修改了localStorage

localStorage.setItem('foo', 'bar');

同一个页面

var orignalSetItem = localStorage.setItem;
localStorage.setItem = function(key,newValue){
    var setItemEvent = new Event("setItemEvent");
    setItemEvent.key = key;
    setItemEvent.newValue = newValue;
    setItemEvent.oldValue = localStorage.getItem(key);
    window.dispatchEvent(setItemEvent);
    orignalSetItem.apply(this,arguments);
}
window.addEventListener("setItemEvent", function (e) {
    console.log('key: '+e.key);
    console.log('newValue: '+e.newValue);
    console.log('oldValue: '+e.oldValue);
});
localStorage.setItem("nm","1234");