ブラウザ内の複数のタブの間の通信はどうやって実現しますか?

本題は主にデータの保存の知識を考察して、データはローカルとサーバーの記憶の2種類の方式があります.ここでは主に地元の保存方法で解決します.すなわち、localStorage、Cookieなどのローカル記憶方式を起動する.
第一の呼び出しlocalStorage一つのタブページにlocalStorage.setItem(key,value)を使って内容を追加(修正、削除)します.別のタブページでstorageイベントを傍受する.localstorgeに記憶されている値が得られ、異なるラベルページ間の通信が可能になる.
タブページ1:

<input id="name">  
<input type="button" id="btn" value="  ">  
<script type="text/javascript">  
    $(function(){    
        $("#btn").click(function(){    
            var name=$("#name").val();    
            localStorage.setItem("name", name);   
        });    
    });    
script>  

タブページ2:

<script type="text/javascript">  
    $(function(){   
        window.addEventListener("storage", function(event){    
            console.log(event.key + "=" + event.newValue);    
        });     
    });  
script>  

第二の種類——呼び出しcookie+setInterval()伝達する情報をクッキーに格納し、クッキー情報を一定時間ごとに読み取り、転送する情報を随時取得することができます.
ページ1:

<input id="name">  
<input type="button" id="btn" value="  ">  
<script type="text/javascript">  
    $(function(){    
        $("#btn").click(function(){    
            var name=$("#name").val();    
            document.cookie="name="+name;    
        });    
    });    
script>  

ページ2:

<script type="text/javascript">  
    $(function(){   
        function getCookie(key) {    
            return JSON.parse("{\"" + document.cookie.replace(/;\s+/gim,"\",\"").replace(/=/gim, "\":\"") + "\"}")[key];    
        }     
        setInterval(function(){    
            console.log("name=" + getCookie("name"));    
        }, 10000);    
    });  
script>