Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

Tags:

dom

firefox

I have a web page with some auto-generated javascript content which manipulates the DOM when users click on certain links. When I save the page in Firefox, it just saves the original page without the DOM modifications. How can I save or dump the current state of the HTML DOM as manipulated by the javascript?

like image 460
Ross Rogers Avatar asked Nov 13 '10 01:11

Ross Rogers


People also ask

How do I copy an entire dom?

You can easily change the DOM without having to edit the HTML as a big piece of string. Right click on a node and select Copy. You can paste in your code editor, or for prototyping, you can paste the DOM node elsewhere in the DOM tree. The pasted node is inserted as a child of the currently selected node.

How do I save DOM in Chrome?

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 Answers

DOM Inspector has a File->Save DOM As... option.

like image 181
Matthew Flaschen Avatar answered Sep 28 '22 06:09

Matthew Flaschen


Looks like FireFox have replaced the DOM Inspector with a new tool that no longer has this functionality.

In the new DOM Inspector Ctrl + Shift + I there is a Console that accepts commands.

This sometimes works...

console.log(document.documentElement.innerHTML)

This gives you something you can inspect but not copy paste because of some bug...

alert(document.documentElement.innerHTML)

This works like console.log(document.documentElement.innerHTML) ought to....

document.documentElement.innerText = document.documentElement.innerHTML
like image 42
teknopaul Avatar answered Sep 28 '22 07:09

teknopaul