Chrome HTML Inspector: Copy original source (and not modified DOM)

Question

I'm working quite a lot with HTML templates. many of those display more then just one visualization within one page. I therefore use chromes html inspector to copy the needed HTML source for a certain table/div from the template. I copy like this:

BUT: I found out, that copying from the HTML inspector actually copies the code from the DOM, which means that my copy of the code contains jquery modifications made by scripts and not the original source for a certain html-element.

Is there any way to copy that element with its sub-items and everything but from the source so that it does NOT contain any modifications of javascript dom manipulation!?

thanks a lot

---

EDIT: The only solution I found is by deactivating the execution of javascript temporarly in the inspector under "settings", then reloading the page and then copying the html-source for a certain node. But it's cumbersome and not really that nice...

Answer 1

SOLUTION:

1. Ctrl+U -> Ctrl+A -> Ctrl+C -> Notepad++ Ctrl+V to paste it there.
2. Optional: Use the TextFX or Tidy Plugin to format the code quickly and maybe identify tags etc easier. But not necessary for Step 3:
3. Use the HTML Tag Plugin in notepad++ via Shift+Ctrl+T to select a HTML Tag until its closing tag (including opening and closing tag), see --> Just copy the selection via Ctrl+C

https://superuser.com/questions/174599/notepad-jump-between-opening-and-closing-html-tags

Answer 2

Might seem a bit of a workaround, although if you use Chrome's Console logging, you can print the contents of a <div> upon load & before jQuery starts it's DOM modifications.

For getting this post's .post-text before modification:

console.log( $$('.post-text')[0].innerHTML );
$(document).ready(function(){
   /** Your JavaScript **/
});

To get a little more out of Chrome with this you could could even use it to Copy the HTML:

//Now press Ctrl + v where-ever you need to paste the contents.
console.log( 
    copy( $$('.post-text')[0].innerHTML )
);

Or a last suggestion, which will pause the page and inspect the elements within Chrome, where you can carry on with your inspector selections:

//or another div/selector.
inspect( document.body ); 
debugger;

$(document).ready(function(){
   /** Your JavaScript **/
});