sty*_*fle 23 dom dump google-chrome-devtools
我想将当前DOM转储到文件中,并能够脱机查看它.基本上,我有一个过时的页面版本,我想留下来进行比较.一旦我关闭浏览器,我就会失去它,所以我想尽可能地保存DOM.
目前已经在Firefox这样的答案,但我怎么做,在Chrome浏览器？
Dam*_*mon 27
使用Web Inspector(F12),转到Elements选项卡,右键单击<html>代码中的标签,然后选择'Copy as HTML'.然后将其粘贴到新文件中并保存.
使用较新版本的 Chrome 很容易做到这一点：
google-chrome --headless --dump-dom 'http://www.yahoo.com'
（OP 可能没有在寻找命令行解决方案，但搜索时此搜索结果看起来很高，因此其他人可能会觉得它有用）
我最喜欢的方法是：
docker run -it --rm --name chrome --shm-size=1024m --cap-add=SYS_ADMIN --entrypoint=/usr/bin/google-chrome-unstable yukinying/chrome-headless-browser --headless --disable-gpu --dump-dom https://www.facebook.com
如果您不熟悉 Docker 的工作原理，请耐心等待 - 第一次会很慢，但随后的调用会很快。
其他信息
经过测试
Ubuntu 16
Linux intel-nuc 4.4.0-21-generic #37-Ubuntu SMP Mon Apr 18 18:33:37 UTC 2016 x86_64 x86_64 x86_64 GNU/Linux
码头工人版本：
Docker version 1.10.3, build 20f81dd
Mac OS X Sierra
Darwin MacBook-Pro.local 16.7.0 Darwin Kernel Version 16.7.0: Thu Jun 15 17:36:27 PDT 2017; root:xnu-3789.70.16~2/RELEASE_X86_64 x86_64 i386 MacBookPro14,3 Darwin
码头工人版本：
Docker version 17.06.1-ce, build 874a737
如果您安装，tidy您也可以缩进 HTML。
在 Chrome Dev Tools Console 中，键入document.documentElement.outerHTML（使用标签按钮自动完成以保存击键）并按 Enter 以查看显示的 DOM 文本。要将其复制到剪贴板并将其粘贴到其他地方，请copy(document.documentElement.outerHTML)改用。
Damon 的回答也不错（在 Dev Tools 中，单击 Elements，右键单击<html>，单击 Copy > Copy outerHTML），但我发现 Console 命令更容易。
我目前使用的 Chrome 版本为 53.0.2785.113 m。其他答案似乎不再有效。要正确复制所有子/后代元素，用户现在必须右键单击，<html>然后在复制之前单击“全部展开”。否则，您将不会递归复制所有元素。普通的 Ctrl+C 将复制所有<html>已展开的内容。
| 归档时间： |
|
| 查看次数： |
14710 次 |
| 最近记录： |