history.pushState() 給網站新增和修改瀏覽歷史記錄

假設一個使用場景：

後臺管理系統專案，左右固定佈局。左側是通用佈局，右側頁面是通過ajax切換的

當我們切換選單後，想返回上一頁，通常點選瀏覽器自帶的回退。會發現回退的不是上一頁，而是最開始開啟這個專案的那一頁。並且當我們重新整理當前頁面。也會自動回退到最初始的頁面

原因：我們切換選單的時候並沒有跳轉頁面，只是用過ajax把我們想要的那也插在右側DIV中。沒有跳轉頁面就意味著瀏覽器沒有存下歷史記錄。

解決辦法：

每次呼叫ajax的時候，並且呼叫成功，我們都在內部加上這個  history.pushState()方法

history.pushState方法接受三個引數，依次為：

state：一個與指定網址相關的狀態物件，popstate事件觸發時，該物件會傳入回撥函式。如果不需要這個物件，此處可以填null。

title：新頁面的標題，但是所有瀏覽器目前都忽略這個值，因此這裡可以填null。

url：新的網址，必須與當前頁面處在同一個域。瀏覽器的位址列將顯示這個網址。

假定當前網址是example.com/1.html，我們使用pushState方法在瀏覽記錄（history物件）中新增一個新記錄。

var stateObj = { foo: 'bar' };

history.pushState(stateObj, 'page 2', '2.html');

這樣位址列就可以看到我們自己存的標識了。歷史記錄也就存進去了

舉個例子：

https://1277502619.github.io/admin/index.html