H5中的history方法Api介紹

最近公司在做一個微信公衆號，看了項目源碼，看到項目中用到了history的Api來進行控制瀏覽器的歷史記錄及前進/後退鍵；

下面來跟大家一起來捋捋history的Api方法和使用：

history.pushState(data,title,url)：在瀏覽器中新增一條歷史記錄；

data會在onpopstate事件觸發時作爲參數傳遞過去，title爲頁面標題，url爲頁面地址；

history.replaceState(data,title,url)：在瀏覽器中替換當前歷史記錄；

data會在onpopstate事件觸發時作爲參數傳遞過去，title爲頁面標題，url爲頁面地址；

history.length()：當前歷史列表中的歷史記錄條數；

window.onpopstate：實際上popstate是一個瀏覽器內置的點擊事件，響應pushState和replaceState的觸發調用；

    //當頁面加載時   
     window.onload=function(){
        pushHistory();
    //新增瀏覽器事件監聽(popstate爲事件名，觸發事件執行function)
      window.addEventListener("popstate",function(e){
          //括號裏面應爲業務代碼(要做的事情)   
        },false);
      function pushHistory(){
　　　　//定義對象
        var state={
           title:“title”,
           url:"#"
          };
　　　　//調用history.pushState方法往瀏覽器歷史記錄上新增一條歷史記錄
       window.history.pushState(state,"title","#");
        }        
    }    

history.back(-1):返回到當前頁的上一頁(原頁面表單中的內容會保留)

history.back(0):頁面刷新

history.back(1):當前頁前進一頁

history.go(-1): 返回到當前頁的上一頁(原頁面表單中的內容會丟失，效果基本和history.back(-1)一樣)

history.forward():當前頁面前進一頁(和history.back(1)效果一樣)

聲名：history方法可以直接調用，例：history.pushState()，也可以用window.history.pushState()來調用。因爲history是屬於瀏覽器中的子對象，兩種調用方法都是生效的；