使用jQuery更改HTML，但“查看源代码”显示旧的答案

【问题标题】：Using jQuery to change the HTML, but "view source" shows the old one使用jQuery更改HTML，但“查看源代码”显示旧的
【发布时间】：2013-07-28 06:45:58
【问题描述】：

我正在使用 jQuery 来动态更改加载的 html，虽然它确实有效，但当我使用“查看页面源代码”菜单在浏览器（Chrome）中查看页面的 html 源代码时，我看到的是旧的，在应用更改之前的 html 代码。

有没有办法查看“更改后”的 html，因为在一天结束时，这是我在浏览器中看到的。

【问题讨论】：

【解决方案1】：

查看源代码始终会向您显示从服务器发送页面时出现的源代码。在 Chrome 中，您可以使用 Inspect Element（或 F12）来调出开发者控制台。它有一个很好的元素视图，可以始终反映页面的当前状态。

此外，在 Firefox 中，您可以拖动以选择页面的一部分并执行“显示选择源”，这将是该区域的计算源。

【讨论】：

【解决方案2】：

大多数情况下View Source会显示初始渲染的Html，使用开发工具看看DOM模型。

在 Chrome 中：Ctrl-shift-i

然后查看元素选项卡，html 会在操作时发生变化。

【讨论】：

谢谢。但是能够看到更改后的 html 代码更容易。至少对我来说。在这种情况下使用 DOM 对我来说似乎有点过头了 - 定位一个更改的节点，展开它以查看子节点，再次展开......简单地查看更改的文本会更快
元素选项卡实际上只是 html。
我明白了——非常有用。它似乎只显示顶级元素。是否可以一次性扩展所有元素（及其子元素等）？
“元素”选项卡不显示实时 DOM，至少在 Angular 应用中不显示，它显示加载的初始 DOM。 Firefox“显示选择源”确实显示了实时操作的 DOM（即在角度处理之后）。