pushState+Ajax實現無刷更新頁面

介紹

Ajax技術確實在現代web中必不可少,可是Ajax對於搜索引擎不夠友好,同時破壞了web瀏覽器的先後跳轉邏輯。pushState正是爲了解決這一問題而產生的一種新技術。javascript

方法實現

  • pushState
    pushState(state,title,url)java

簡單來講該方法是,將當前狀態state壓棧,並將當前地址了改爲url,設置該狀態的title(這個參數的做用不大,能夠爲空)。web


  • replaceState
    replaceState(state,title,url)瀏覽器

replaceState和pushState的最大區別就是,replaceState不會將當前狀態記錄,即不會把state壓棧。搜索引擎


window.addEventListener('popstate', function(event){
 // 獲取以前push的state參數
  var state = event.state
  // state存儲的能夠是url,title等信息
  // 這時能夠調用replaceState來恢復地址欄地址
}, false);
相關文章
相關標籤/搜索