我要么梦想chrome(开发频道)实现了一种方法来更新地址栏通过javascript(路径,而不是域名),而不需要重新加载页面,或者他们真的已经这样做了。
然而,我找不到我想我读过的那篇文章。
是我疯了还是有办法做到这一点(在Chrome)?
附注,我说的不是窗口位置。哈希,等等。如果上述情况存在,这个问题的答案将是不正确的。
我要么梦想chrome(开发频道)实现了一种方法来更新地址栏通过javascript(路径,而不是域名),而不需要重新加载页面,或者他们真的已经这样做了。
然而,我找不到我想我读过的那篇文章。
是我疯了还是有办法做到这一点(在Chrome)?
附注,我说的不是窗口位置。哈希,等等。如果上述情况存在,这个问题的答案将是不正确的。
现在你可以在大多数“现代”浏览器中做到这一点!
以下是我读过的原文(发布于2010年7月10日):HTML5:在不刷新页面的情况下更改浏览器url。
有关pushState/replaceState/popstate(又名HTML5 History API)的更深入的了解,请参阅MDN文档。
TL, DR,你可以这样做:
window.history.pushState("object or string", "Title", "/new-url");
有关基本操作方法,请参阅我的回答“在不重新加载页面的情况下修改URL”。
只更改旧的哈希浏览器之后的内容
document.location.hash = 'lookAtMeNow';
更改完整URL。Chrome, Firefox, IE10+
history.pushState('data to be passed', 'Title of the page', '/test');
以上操作将在历史记录中添加一个新条目,因此您可以按后退按钮返回到以前的状态。在不向历史记录中添加新条目的情况下更改URL
history.replaceState('data to be passed', 'Title of the page', '/test');
现在试试在控制台中运行这些程序!
更新到david answer,甚至可以检测不支持推送状态的浏览器:
if (history.pushState) {
window.history.pushState(stateObj, "title", "url");
} else {
window.history.replaceState(stateObj, "title**", 'url');
// ** It seems that current browsers other than Safari don't support pushState
// title attribute. We can achieve the same thing by setting it in JS.
document.title = "Title";
}
状态
状态对象是一个JavaScript对象,它与传递给replaceState方法的历史条目相关联。状态对象可以为空。
标题
大多数浏览器目前都会忽略这个参数,尽管将来可能会用到它。在这里传递空字符串应该是安全的,以防将来对方法进行更改。或者,您可以为州传递一个简短的标题。
url可选
历史记录条目的URL。新URL必须与当前URL的来源相同;否则replaceState抛出异常。
var newurl = window.location.protocol + "//" + window.location.host + window.location.pathname + '?foo=bar';
window.history.pushState({path:newurl},'',newurl);