How can I dump the entire Web DOM in its current state in Chrome?

血红的双手。 提交于 2019-12-03 23:51:03

问题


I want to dump the current DOM to a file and be able to view it offline. Essentially, I have an outdated version of a page that I would like to keep around for comparison. As soon as I close my browser, I'm going to lose it so I would like to save the DOM exactly as it is.

There is already an answer for doing this in Firefox but how do I do it in Chrome?


回答1:


Using the Web Inspector (F12), go to the Elements tab, right click on the <html> tag in your code and select Copy->Copy outerHTML. Then paste that into a new file and save.




回答2:


I am currently using version 53.0.2785.113 m of Chrome. The other answers no longer appear to be valid. To properly copy all child/descendant elements the user now has to right click on <html> then click "Expand All" before copying. Other wise you will not recursively copy all elements. A normal Ctrl+C will copy everything one <html> has been expanded.




回答3:


Command line solution

This is easy to do with newer releases of Chrome:

google-chrome --headless --dump-dom 'http://www.yahoo.com'

(The OP may not have been looking for a command line solution but this search result appears high when searching so others might find it useful)


Original answer 2017

My favorite way to do this is:

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

If you're not familiar with how Docker works, be patient - the first time will be slow but subsequent invocations will be quick.


Other information

Tested on

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:

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:

Docker version 17.06.1-ce, build 874a737

If you install tidy you can indent the HTML too.



来源:https://stackoverflow.com/questions/12147007/how-can-i-dump-the-entire-web-dom-in-its-current-state-in-chrome

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!