为 AJAX 请求重新加载页面源答案

【问题标题】：reload page source for AJAX request为 AJAX 请求重新加载页面源
【发布时间】：2012-09-03 12:45:56
【问题描述】：

我发现如果我在页面上使用 AJAX 调用，页面源将保持不变。这可能会导致问题，例如如果用户在浏览器中使用前进/后退操作，当它返回页面时，浏览器将拥有/读取原始 HTML 代码，而不是带有 AJAX 内容的代码。例如，假设您使用

构建了一个页面

<div id="foo">
<script type="text/javascript">
setTimeout('ajaxFunction', ...);
</script>
</div>

一旦你加载页面，它会调用 ajaxFunction，它最终会用 id="foo" 替换 div 标签的内容（顺便说一句，它也可以是递归调用）。但是您可以从浏览器查看的页面源代码仍然会包含这个 sn-p。有什么方法可以在不重新加载页面的情况下刷新页面源代码？

我知道我可以在我的 AJAX 代码中添加页面重新加载，但我想避免它并且不打扰最终用户。

【问题讨论】：

标签： javascript html ajax reload

【解决方案1】：

浏览器正在向您显示它在 HTTP 响应中从服务器接收到的内容。 DOM 中的所有动态变化都不会反映在那里。因此，您可以使用 FF 中的 firebug 或 Chrome 中的开发者工具来跟踪动态变化。

【讨论】：

我喜欢这个答案。学习使用 FF 或 Chrome 开发者工具对于查看动态源代码至关重要。
问题不在于我非常了解的开发人员工具，而在于不同的主题。

【解决方案2】：

如果您正在使用右键单击可用的“查看源代码”选项 - 某些浏览器（如果不是全部）正在执行另一个请求以获取 HTML。开发人员工具/Firebug 将向您显示更新的 HTML，但似乎在下一个/向前导航后显示初始 HTML（未使用 JS/AJAX 进行更改）。我认为 chrome 也会缓存动态更改，但只是检查了一下，它显示了初始页面。假设没有办法改变这种行为。就我而言，这里唯一的方法是在 document.onload 中调用 ajaxFunction，如果您想确保向用户显示最新信息。

【讨论】：

【解决方案3】：

如果您绝对需要在不重新加载或重新提交的情况下获取已加载的页面源代码，我建议您使用此 Chrome 扩展程序，它在大多数情况下都运行良好。

https://chrome.google.com/webstore/detail/quick-source-viewer/cfmcghennfbpmhemnnfjhkdmnbidpanb

【讨论】：