如何在github源浏览器中完成AJAX？

Github有一个非常好的源浏览器。 在repo中的不同path之间导航会生成ajax调用来加载内容（如在firebug日志中可以清楚地看到的那样）。 ajax调用返回要显示的新文件列表的html。 除了更改文件的视图列表之外，URL也会更改。 但是，它不使用像大多数Ajax深层链接网站（使用＃）的片段。 在github整个url改变。

例如在Django回购在https://github.com/django/django去django文件夹将生成一个Ajax请求到https://github.com/django/django/tree/master/django?slide=1&_=1327709883334其中将返回该文件夹的HTML内容。 链接也将更改为https://github.com/django/django/tree/master/django 。 正如你可以看到这个新的链接不使用片段。

这是怎么做的？ 我一直认为，基于AJAX的网站必须使用URL片段（＃）来实现深层链接，但显然不是这样。

Answer 1

那么，就像Dav在评论中所描述的那样，GitHub似乎没有使用pAjax库。 由于我最终回答了一个“不正确的”信息（实际上我认为我在回答这个问题时曾经看到过使用pAjax的GitHub的相关内容，但是目前我找不到源代码）正确答案。

我没有发现任何官方的开发人员是否使用任何库，只发现一篇文章说，使用历史API： https ： //github.com/blog/760-the-tree-slider

然后来到我的头上，为什么不问代码本身？

使用Chrome（实际上任何浏览器都有一个体面的开发者工具），打开一个仓库（在这种情况下，pAjax），右键单击任何目录，只需select检查元素。

这将显示负责目录链接a元素。

一个“嫌疑犯”类出现了，让我们在页面的JavaScript源search它。

在这里，它是目录链接的单击事件处理程序，除了与animation和历史API相关的整个代码之外。 而且可以注意到，它并没有使用History Api背后的任何库。 不要忘记标记漂亮打印选项。

---

旧的和不正确的答案

GitHub使用jQuery插件pJax （pushState + Ajax），它使用HTML5历史API。

Answer 2

您必须使用HTML5的pushState（）方法来更改浏览器历史logging。

 window.history.pushState(data, "Title", "/new-url"); 

Doc说：

pushState（）有三个参数：一个状态对象，一个标题（当前被忽略）和（可选）一个URL。

最后一个参数是新的URL。 出于安全原因，您只能更改URL的path，而不是域本身。 第二个参数是对新状态的描述。 第一个参数是你可能想要与状态一起存储的一些数据。