history對象

history

window.history 對象是HTML5提供的用於維護當前標籤頁瀏覽歷史的對象。主要功能是前進後退和在不刷新頁面的狀況下，修改地址欄裏的URL地址。

屬性

經常使用的屬性只有 history.length， 表示當前標籤頁瀏覽歷史的長度，初始值是 1。對history.length賦值並不會起做用，也沒有任何反應。

方法

前進後退

1. history.back() 後退到上一個頁面。當前已是第一個頁面時，調用此函數不會有任何反應。
2. history.forward() 進入歷史的下一個頁面。當前已是最後一個頁面時，調用此函數不會有任何反應。
3. history.go(step) step爲正前進step個頁面，step爲負後退step和頁面，超過頁面歷史範圍的調用不會有任何反應。

修改歷史（地址欄的URL）

1. history.pushState(state, title, url) 不刷新頁面並添加一條歷史記錄，title表示下個頁面的標題（貌似目前全部瀏覽器都忽略state和title）；url表示新的地址。
2. history.replaceState(state, title, url) 替換當前地址欄裏的url，state和title會被全部瀏覽器忽略。

相關事件

1. popstate，前進或者後退時會觸發。pushState 和 replaceState 不會觸發此事件。
2. hashchange，當前頁面的hash值發生變化時觸發。

應用

1. 改變瀏覽歷史，不讓用戶回退到某個頁面。
2. 前端路由。 經常使用的前端路由是經過hash實現的，history提供了操做歷史的api後，就能夠經過history來實現了。

附

URL各部分的含義：
https://www.baidu.com/search?word=abc&time=12345#/article/item?title=hello
host: www.baidu.com
origin: https://www.baidu.com
pathname: /search
search: ?word=abc&time=12345
hash: #/article/item?title=hello

向服務器發起請求的時候 hash 部分不會被髮送出去，所以須要傳遞給服務器的query參數必須放到hash前面。而hash後面的參數通常在前端路由時被讀取和處理。