关于javascript:使用新URL更新地址栏,无需哈希或重新加载页面

Updating address bar with new URL without hash or reloading the page

我或者梦见chrome(dev channel)实现了一种通过javascript(路径,而不是域)更新地址栏的方法,而不需要重新加载页面,或者他们真的做到了这一点。

但是,我找不到我认为我读过的那篇文章。

我疯了还是有办法(铬合金)?

另外,我不是在说window.location.hash等。如果上述情况存在,这个问题的答案将是不真实的。


现在您可以在大多数"现代"浏览器中执行此操作!

这是我阅读的原始文章(发表于2010年7月10日):HTML5:在不刷新页面的情况下更改浏览器URL。

要更深入地了解pushstate/replacestate/popstate(也称为HTML5历史API),请参阅MDN文档。

tl;dr,您可以这样做:

1
window.history.pushState("object or string","Title","/new-url");

请参阅我的答案,在不重新加载页面的情况下修改URL,了解基本操作方法。


只更改哈希后的内容-旧浏览器

1
document.location.hash = 'lookAtMeNow';

正在更改完整的URL。Chrome、火狐、IE10+

1
history.pushState('data to be passed', 'Title of the page', '/test');

上面将向历史记录中添加一个新条目,以便您可以按"上一步"按钮转到上一个状态。若要在不向历史记录添加新条目的情况下就地更改URL,请使用

1
history.replaceState('data to be passed', 'Title of the page', '/test');

尝试在控制台中运行这些程序!


更新到davids答案,即使检测浏览器也不支持pushstate:

1
2
3
4
5
if (history.pushState) {
  window.history.pushState("object or string","Title","/new-url");
} else {
  document.location.href="/new-url";
}