如何在不重新加載頁面的情況下更改地址欄中的URL？

Question

Shopify如何做到這一點？ 轉到他們的網站，點擊功能鏈接，您會看到瀏覽器地址欄中的URL顯示：

http://www.shopify.com/tour/sell-online

然后單擊任何子鏈接，您將看到地址欄中的URL更改而不使用哈希，並且沒有頁面翻轉。

我不認為他們使用ajax來更改內容，因為它似乎都包含在頁面上的隱藏div中，但無論如何，您顯然可以使用客戶端技巧更改URL。 感謝您的幫助？

Answer 1

您使用新的HTML5歷史記錄API來推送新狀態。

這是MDN文檔和一個很好的教程 。

請注意，這樣做通常很痛苦（您必須正確管理應用程序的狀態），並且它不適用於IE9 。 它幾乎總是與ajax結合使用：即使整個頁面沒有重新加載或更改，它也是允許動態加載的內容可加入書簽的解決方案。

Answer 2

查看pushState ，但請注意，並非所有瀏覽器都支持它。