10、如何实现浏览器内多个标签页之间的通信?

如何实现浏览器内多个标签页之间的通信？（阿里）

WebSocket的，SharedWorker;

也可以调用localstorge，饼干等本地存储方式;

localstorge另一个浏览上下文里被添加，修改或删除时，它都会触发一个事件

我们通过监听事件，控制它的值来进行页面信息通信;

注意quirks：Safari在无痕模式下设置localstorge值时会抛出QuotaExceededError的异常;

• 使用localStorage的

使用localStorage.setItem（键，值）;添加内容

使用存储事件监听添加，修改，删除的动作

window.addEventListener("storage",function(event){  
        $("#name").val(event.key+”=”+event.newValue);  
}); 

• 使用的cookie +的setInterval

Html

<inputidinputid="name"><input type="button" id="btnOK"value="发送">  

页面1：js

$(function(){  
  $("#btnOK").click(function(){  
    varname=$("#name").val();  
    document.cookie="name="+name;  
  });  
});  

页面2：js

//获取Cookie天的内容  
function getKey(key) {  
    return JSON.parse("{\""+ document.cookie.replace(/;\s+/gim,"\",\"").replace(/=/gim, "\":\"") +"\"}")[key];  
}  
//每隔1秒获取Cookie的内容  
setInterval(function(){  
    console.log(getKey("name"));  
 },1000);