使用新的URL更新地址栏而不散列或重新加载页面

2018-06-03 14:07:35

我或者梦想着实现一种通过javascript（路径，而不是域）更新地址栏的方式来实现Chrome（开发通道），无需重新加载页面，或者他们确实已经完成了这项工作。

但是，我找不到我认为我阅读过的文章。

我疯了还是有办法做到这一点（在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';

更改完整网址（域名和协议必须与原始网址相同！）Chrome，Firefox，IE10 +

history.pushState('data to be passed', 'Title of the page', 'https://stackoverflow.com/test');

以上将添加一个新的历史记录，以便您可以按“返回”按钮转到以前的状态。要更改网址而不添加历史记录使用的新条目

history.replaceState('data to be passed', 'Title of the page', 'https://stackoverflow.com/test');

尝试在控制台中运行这些！

更新到大卫回答甚至检测浏览器不支持pushstate：

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

链接地址: http://www.djcxy.com/p/12121.html