Can I see the resulting markup after JavaScript Dom manipulation?

Question

Is there any way to get a browser (or some other program) to show me the DOM of a web page, as modified by JavaScript code?

For example, say I have some simple markup. I then use some JavaScript (say, via jQuery) to add classes, move things around, etc. Is there any way to "view source" on the modified version, as it would look if that was how it was originally marked up?

No real reason, just curious if there's something that does that. I've seen people post examples like "here's what the markup would look like after modification", and I didn't know if they did that by hand, or if there's a nifty tool (or obvious way I haven't thought of) to do that.

Answer 1

Yes; FireBug shows you the current DOM via its inspector, HTML, and DOM tabs.

Answer 2

on firefox there's a plugin called "web developer toolbar". it has the ability to "view generated source". you can also use firebug and just explore the dom, watching your changes in real time-ish.

Answer 3

Use Firebug or Safari's Web Inspector (Chrome has the same thing) or the Developer Toolbar for IE.