Javascript 如何动态更改页面的HTML源代码？

直到现在，我还认为不完全重新加载页面就不可能修改页面的HTML源代码。我怀疑我刚才看到的内容与pushState有某种联系（但不仅如此）：在Quartz网站（qz.com）上，一旦你读到了文章的底部，你就可以无缝地转到下一篇文章，并对URL进行了干净的更新，令人惊讶的是，还更新了HTML源代码

例如，向下滚动任何文章，例如：

也许我错过了什么，但有人能解释一下这是怎么做到的吗？这里使用了哪些HTML5API

---

注意：我的问题特别关注于更新显示页面源代码时可以看到的HTML内容（显然不是DOM检查器）。

这看起来很像典型的异步内容加载，但是是的，他们使用pushState更改url。我想，让你感兴趣的是，这些路由设计得很好，因此，访问该URL时，你会首先看到同一篇文章。然而，在幕后，所有这些都只是一系列JSONP请求与pushState（）相结合，以生成一个流畅、格式良好的文档。您甚至可以使用任何现代调试控制台的“网络”选项卡来验证请求

有关使用pushState更新url的信息，请参阅此答案：

编辑

---

既然你被源代码如何变化这一事实所困扰，那么你可以这样想：当我说“路由设计得很好，所以先访问该URL会得到相同的文章”时，我的意思是，访问该页面会反映出该文章。查看源代码所做的一切就是获取活动URL（由pushState修改，因此您实际上要转到另一个页面来检索源代码）并获取文本，而无需DOM解析/呈现。我希望这能澄清这个网站正在发生的事情。

你现在可以在大多数“现代”浏览器中这样做了

这是我读到的原始文章（发布于2010年7月10日）：（）

要更深入地了解pushState/replaceState/popstate（又称HTML5历史API），请参阅MDN文档

您可以这样做：

---

pushState（“对象或字符串”、“标题”、“新url”）

在我看来，他们正在使用主干使其成为一个单页应用程序。@httpNick我在开发工具的源代码中看不到主干。使用哪个库并不重要。这可以在vanilla js中使用XHR和pushState轻松完成，我认为我们不应该针对特定的库进行讨论。它是绑定的，您必须搜索绑定的源以查看是否包含它。是的，pushState有一个状态参数（第一个），允许您保存状态。但这是一个普通的JS对象，据我所知，你不能神奇地粘贴到页面源代码中！卡住了？不，只是问个问题。对不起。我不是在做假设，也不是在试图居高临下。我来自哪里，这意味着更多的是不完全理解某些东西。e、 g.陷入在线缓存工作原理或魔术师如何从帽子中拉出兔子的困境。