我要么梦想着 chrome(开发频道)实现一种通过 javascript(路径,而不是域)更新地址栏的方法,而无需重新加载页面,要么他们真的做到了。
但是,我找不到我认为我读过的文章。
我疯了还是有办法做到这一点(在 Chrome 中)?
ps 我不是在谈论 window.location.hash 等。如果上述情况存在,那么这个问题的答案将是不真实的。
我要么梦想着 chrome(开发频道)实现一种通过 javascript(路径,而不是域)更新地址栏的方法,而无需重新加载页面,要么他们真的做到了。
但是,我找不到我认为我读过的文章。
我疯了还是有办法做到这一点(在 Chrome 中)?
ps 我不是在谈论 window.location.hash 等。如果上述情况存在,那么这个问题的答案将是不真实的。
您现在可以在大多数“现代”浏览器中执行此操作!
这是我阅读的原始文章(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';
更改完整网址。铬、火狐、IE10+
history.pushState('data to be passed', 'Title of the page', '/test');
以上将向历史记录添加一个新条目,因此您可以按“返回”按钮转到先前的状态。要在不向历史记录中添加新条目的情况下更改 URL
history.replaceState('data to be passed', 'Title of the page', '/test');
现在尝试在控制台中运行这些!
更新到 Davids 答案甚至可以检测不支持 pushstate 的浏览器:
if (history.pushState) {
window.history.pushState("object or string", "Title", "/new-url");
} else {
document.location.href = "/new-url";
}
var newurl = window.location.protocol + "//" + window.location.host + window.location.pathname + '?foo=bar';
window.history.pushState({path:newurl},'',newurl);