JavaScript 調整 URL 不跳頁

HTML5 加入了 history.pushState() 和 history.replaceState() 方法，可以加入或修改歷史紀錄達到此效果。

第 1 個是 history.pushState()

history.pushState(state, title, url);

// 範例
history.pushState(null, '我是工程師但我是女生', 'https://girlwebdeveloper2.blogspot.com/');

第 2 個是 history.replaceState() 用法和 history.pushState() 一模一樣。

兩者的差別在於 pushState 會新增一筆歷史記錄，replaceState 會取代目前的記錄。所以使用 pushState 回上一頁時會回到原本的網址，replaceState 則會回到原網址的上一頁。

參考文件

• 改變 URL 不換頁