浏览器中查看源代码上显示的源代码是否始终准确/完整？

Question

我对某个特定网页有疑问。当我点击一个链接时，我收到一个应用程序错误（不是 http 错误等，而是应用程序级错误）。
但是我打开了开发人员工具和网络控制台，我看到没有请求发送到服务器。
所以我双击并选择了查看源代码，我看到这个错误是动态生成的 html 的一部分，但 html 页面似乎格式错误。
好像就这样结束了：

<div id="theId"> You can not access page 
</html>  

不过，整个页面看起来还不错。当我使用 Crome 或 Firefox 时，我看到了同样的情况。（IE 不是一个选项，因为我没有可用的 Windows 电脑）。
视图源不允许我“研究”页面，例如展开标签等
我怎样才能调试这样的东西？会不会是浏览器无法正确显示代码的原因？

Answer 1

在 Firefox 中，使用 Web Developer Toolbar，有一个“查看源代码”菜单，其中包含“查看生成的源代码”的下拉选项。在被 javascript 处理和更新后，这会输出检查员看到的完整 html 源代码。一个非常有用的插件，在 Firebug 出现之前是我的中流砥柱。

Answer 2

“查看源代码”给出服务器发送的 HTML。通常更有用的是查看生成的文档结构。

在 Chrome 中，您可以通过打开开发人员工具（Mac 上的 cmd-alt-i，Windows 上的 ctrl-alt-i）然后查看元素选项卡（第一个选项卡）来执行此操作。 在 Firefox 中，您需要查看“Inspector”选项卡。

在 Chrome 和 Firefox 中，您可以右键单击任何页面元素并选择“检查元素”。这将打开带有文档结构的选项卡，并显示所选元素。这比寻找你自己感兴趣的元素更容易。

此外，当鼠标悬停在文档树中的某个元素上时，两个浏览器都会在常规视口中突出显示您指向的元素。

最终的文档结构（或至少在那个时间点之前的最终结构）可能与服务器发送的 HTML 不同的原因有两个：

1. 修改文档的Javascript。对于大量使用 Javascript 的网站（尤其是所谓的单页应用程序），生成的文档结构可能与原始 HTML 源有很大不同。这只是构成呈现页面的基础。之后 Javascript 做了很多工作。
2. HTML 格式错误。在这种情况下，所有浏览器都会尝试充分利用它们所拥有的资源来生成有效的文档结构。

Answer 3

要回答你标题中的问题，如果你说话的 javascript 是，如果你说话的 html 不是，那么它是准确的，但不是完整的。

---

Html 可以并且存在于由服务器端语言甚至是 javascript 生成的许多 Web 应用程序中。因此，根据您从服务器请求的内容，HTML 可能远未完成。

此外，当使用 ruby​​ 或 php 等语言生成 html 时，很容易最终生成糟糕/糟糕的 html。

使用 javascript 的情况略有不同。由于它的本质，所有 javascript 源都必须以某种形式在您的浏览器中提供。但是请注意，像 jquery 之类的东西可以被您的浏览器缓存，这意味着当您打开开发人员控制台时，它的代码可能不会显示。

然后您遇到了缩小器和混淆的问题，然后是用于缩小的混淆代码的混淆器！这会留下可怕的混乱。

我的猜测是他们的服务器生成了一些错误的 html，然后破坏了他们的 javascript，（导致 javascript 没有像您在网络日志中看到的那样调用服务器），然后在您这边处理并显示错误消息通过捕获错误的 javascript。

Answer 4

据我所知，“查看源代码”会为您提供网络服务器发送给您的网络浏览器的任何内容。在呈现语法错误的 HTML 时，Web 浏览器通常非常宽容。如果您是开发此网页的人，您可能需要仔细查看它发送的内容。