在HTML中使用history.pushState()
方法可以修改瀏覽器歷史記錄的狀態,并改變當前URL而不刷新頁面。
語法:
history.pushState(state, title, url);
參數解釋:
state
:一個對象,表示要添加到歷史記錄中的狀態對象。
title
:一個字符串,表示新的歷史記錄條目的標題,大多數瀏覽器并不使用該參數。
url
:一個字符串,表示新的歷史記錄條目的URL。
示例代碼:
history.pushState({page: 1}, "Page 1", "/page1");
在上面的示例中,pushState
方法將一個狀態對象 {page: 1}
添加到瀏覽器的歷史記錄中,并且將URL更改為 /page1
。頁面不會刷新,但是URL將會更新。
注意:
使用 pushState
方法不會觸發任何頁面加載事件,所以你需要自己處理URL的變化,并進行相應的操作。
對于使用 pushState
方法修改URL的頁面,可以使用 popstate
事件來監聽URL的變化,當用戶點擊瀏覽器的前進或后退按鈕時會觸發該事件。