如何在Firefox中查看"生成的HTML代码"?

nop*_*ole 31 firefox firebug code-generation firefox-addon web-developer-toolbar

如果使用Firebug,我们可以单击HTML选项卡,然后单击以展开每个元素以查看生成的HTML代码.有没有办法扩展它或获得纯文本文件?

我只是偶然发现甚至不需要Firebug.我们可以在网页上按CTRL-A(全选),然后右键单击并选择"查看选择源",然后我们将获得"当前HTML代码"的纯文本文件,甚至会看到一个<div><body>如果Firebug打开,Firebug面板位于标记之前.但这似乎是一种奇怪的方式来调用它.还有其他方法吗?

(更新:生成的HTML通常是指JavaScript更改DOM后的HTML.它是当前的DOM树而不是原始源代码)

use*_*621 27

在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;
Run Code Online (Sandbox Code Playgroud)


Ger*_*der 18

使用Web Developer工具栏加载项,选择View Source - View Generated Source.如果要查看原始来源,请选择查看来源 - 查看来源(或只需按CTRL- SHIFT- U)

  • 该工具栏是我的生命线,但现在此关键功能不存在:( (2认同)
  • 从带有 Web 开发人员工具栏 2.0.1 的 Firefox 68.0.2(32 位) 开始,菜单中不再显示“查看源代码”。 (2认同)

gio*_*ele 5

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

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

  • 这似乎没有显示生成的源代码(即它不反映 JavaScript 所做的更改)。或许 Firefox 57 有所改变? (3认同)