34

如果使用 Firebug，我们可以单击 HTML 选项卡，然后单击展开每个元素以查看生成的 HTML 代码。有没有办法将其全部展开或获取纯文本文件？

我只是偶然发现甚至不需要Firebug。我们可以在网页上直接按CTRL-A（全选），然后右键选择“查看选择源”，然后我们会得到一个“当前HTML代码”的纯文本文件，甚至会看到<div>一个<body>如果 Firebug 已打开，则位于标记之前的 Firebug 面板。但这似乎是一种奇怪的调用方式。还有其他方法吗？

（更新：生成的 HTML 通常是指 JavaScript 改变 DOM 后的 HTML。它是当前的 DOM 树而不是原始源代码）

4

5 回答 5

29

在 Firebug 的 HTML 选项卡中，右键单击根节点并选择“复制 HTML”。然后粘贴到文本编辑器。

如果没有 Firefox 附加组件，您可以使用这样的书签：

javascript: var win = window.open(); win.document.write('<html><head><title>Generated HTML of  ' + location.href + '</title></head><pre>' + document.documentElement.innerHTML.replace(/&/g, '&amp;').replace(/</g, '&lt;') + '</pre></html>'); win.document.close(); void 0;
于 2010-07-24T07:58:56.707 回答
18

使用Web Developer 工具栏插件，选择View Source - View Generated Source。如果要查看原始源，请选择查看源-查看源（或直接按CTRL- SHIFT- U）

于 2010-07-23T00:02:12.820 回答
4

使用 Firefox DevTools（自 35 版以来集成在 FF 中），您可以打开 Web 检查器 ( CTRL- shift- C) 并选择HTML选项卡来查看生成的 HTML。

您可以通过右键单击<html>并选择Copy inner HTML 来复制生成的 HTML。

于 2016-01-21T09:37:35.900 回答
0

如果您正在寻找程序化解决方案，您只需将文档输入 XMLSerializer。

于 2010-07-31T16:37:52.430 回答
-1

我不知道我是否很好地理解了你的问题，但这里有一些非常简单的东西，你不需要另一个插件。

每个浏览器都有查看实际页面源代码的本机功能，只需右键单击并查找类似于“源”或“代码”的内容。

例如，在 Firefox 中它只是“源代码”，在 Chrome 中它是“查看页面源代码”等等。

话虽如此，Web Developer 工具栏确实是一个很棒的插件，尤其是如果您也使用 CSS。

于 2010-07-23T08:05:22.843 回答