javascript - 获取 javascript 渲染页面的 html（与其交互后）

Question

我希望能够在与 html 页面交互后保存它的状态。

假设我单击了一个复选框，或者 javascript 设置了各种元素的值。

如何保存“javascript-rendered”页面？

谢谢。

score 44 · Accepted Answer

在 Chrome（显然是 Firefox）中，有一个特殊的 copy() 方法可以将渲染的内容复制到剪贴板。然后，您可以通过将其粘贴到您喜欢的文本编辑器来做任何您想做的事情。

控制台示例：

copy(document.body.innerHTML);

注意：我注意到该方法运行后 Chrome 报告未定义，但是，它似乎正确执行并且正确的内容在剪贴板中。

score 27 · Accepted Answer

应该这样做并且会抓取所有页面，而不仅仅是正文

console.log(document.getElementsByTagName('html')[0].innerHTML);

score 4 · Accepted Answer

document.body.innerHTML将为您提供当前文档正文的 HTML 表示形式。

这不一定包括 DOM 对象的所有内部状态，因为 HTML 包含对象的初始默认状态，不一定是它们可能已更改为的状态。保证您获得所有状态的唯一方法是列出您要保存的状态并实际以编程方式获得该状态。

要回答关于保存它的部分问题，您必须更多地描述您真正要解决的问题。

score 1 · Accepted Answer

要获得与呈现 javascript 的等效视图源，包括 doctype 和 html 标记，请将命令复制到 chrome 控制台：

console.log(new XMLSerializer().serializeToString(document.doctype) + document.getElementsByTagName('html')[0].outerHTML);

在 chrome 控制台中，将鼠标悬停在输出的末尾，然后单击复制链接以复制到粘贴板。

4 回答 4