一、localStorage
（1）localStorage是什麼？
localStorage物件在修訂過的HTML5規範中作為持久儲存在客戶端資料的方案取代了globalStorage，是Storage的例項。
注意：要訪問一個localStorage物件，頁面必須來自同一個域名（子域名無效），使用同一種協議，在同一個埠上。相當於globalStorage[localhost.host]。

（2）localStorage怎麼用？
localStorage作為Storage的例項，可以使用Storage例項的方法。
常見操作：

        localStorage.setItem('name'
 
,'lwf');
        localStorage.age=21;//注意後填加的放在localStorage的前面

        console.log(localStorage.getItem('name'));//lwf
        console.log(localStorage.age);//21
        console.log(localStorage);//Storage {age: "21", name: "lwf", length: 2}
        console.log(localStorage.key(0));//age,注意index從0開始


        console.log
 
(localStorage.length);//2

        localStorage.removeItem('name');
        console.log(localStorage.getItem('name'));//null

        localStorage.clear();
        console.log(localStorage);//Storage {length: 0}

（3）怎麼使用localStorage實現多標籤之間的通訊？
index.html：

 <input type="text">
    <button id="btn"
 
>Click</button>
    <script>
        window.onload=function(){
            var oBtn=document.getElementById("btn");
            var oInput=document.getElementsByTagName("input")[0];
            oBtn.onclick=function(){
                var val=oInput.value;
                localStorage.setItem("value",val);
            }
        }
    </script>

test.html:

<script>
        window.addEventListener("storage",function(event){
            console.log("value is"+localStorage.getItem("value"));
            console.log("key is"+event.newValue);
        },false);    
    </script>

注意：只能實現同一瀏覽器相同域名、相同協議、相同埠下的多個標籤頁之間的通訊。不同瀏覽器沒有該效果。
效果：

（4）localStorage可以實現同一瀏覽器多個標籤頁之間通訊的原理
localStorage是Storage物件的例項。對Storage物件進行任何修改，都會在文件上觸發storage事件。當通過屬性或者setItem()方法儲存資料，使用delete操作符或removeItem()刪除資料，或者呼叫clear()方法時，都會發生該事件。這個事件的event物件有以下屬性：

• domin：發生變化的儲存空間的域名；
• key：設定或者刪除的鍵名；
• newValue：如果是設定值，則為新值；如果是刪除值，則是null；
• oldValue：鍵被更改之前的值；