通过 Javascript 更新地址栏答案

【问题标题】：Updating the Address bar Through Javascript通过 Javascript 更新地址栏
【发布时间】：2011-05-30 12:05:16
【问题描述】：

直到现在我知道它不可能在不更改页面的情况下更改位置栏的内容（是的，我不是在谈论#）。我最近注意到 github.com。他们是如何在他们的网站上做到这一点的？当用户单击浏览器的后退或下一步按钮时，他们可以轻松获得事件。 dojo.back 也有这个功能。但是如何在不离开页面的情况下用javascript更改地址栏呢？

【问题讨论】：

标签： javascript ajax browser dojo github

【解决方案1】：

您在 GitHub 上指的是 #（哈希）。当您右键单击行号时，它会将数字添加到您的哈希中。

window.location.hash = 'HELLO';

把它放在一个页面中进行尝试。在不重新加载页面的情况下无法更改 window.location。后退按钮的东西有点棘手，但 Dojo 是你最好的选择。 jQuery 不提供这个。不过，Dojo 的代码非常简洁，因此您应该能够对其功能进行逆向工程（如果您选择将该功能包含到您自己的库中）。

您还会注意到 Google 也在做同样的事情：http://code.google.com/p/digitalxero/source/browse/#svn%2Ftrunk%2Flocale%2Fde

如果您单击文件夹（左），它会更改哈希，并提供不同的内容。

【讨论】：

在 github 上没有，我看不到 #（哈希）。这就是我想知道的原因。当我点击某个文件夹时，我看到 Complete URL Change 'WITHOUT' #。
@user - 你能提供一个 URL。如果我能看到该页面，我可能会提供更好的帮助。

【解决方案2】：

试试dojo.hash

【讨论】：

【解决方案3】：

有两种方式：

HTML5 的pushState() 函数。例如，Facebook 和 Github 就使用了这个。它允许您修改完整的 URL 并在历史状态更改时触发事件处理程序。 Mozilla 有一个good overview。
旧变体是使用 URL 的 hash 部分（这是 Twitter 所做的）。这意味着您更改window.location.hash，监视它的更改，并根据该哈希值加载适当的内容。然而，这意味着当用户请求时，例如，http://twitter.com/#!/27c3/status/18331752900591616，只有哈希符号之前的部分被请求来自网络服务器，哈希之后的所有内容仅客户端的业务。这意味着服务器还不能决定将什么内容交给客户端。

【讨论】：