Thursday, February 23rd, 2006

IE Tip: Cheeky way to see the current state of the page

Category: HTML, IE, Tip

IE7

Who needs debuggers and add ons, when you can simply put the following in your IE address bar:

javascript

  1. javascript:'<xmp>'+window.document.body.outerHTML+'</xmp>';

Posted by Dion Almaer at 10:21 am
13 Comments

+++--
3.8 rating from 89 votes

13 Comments »

Comments feed TrackBack URI

or for IE:

javascript:'<xmp>'
+window.document.documentElement.outerHTML
+'</xmp>';

Comment by michael — February 23, 2006

Or, push it to a new popup window so you don’t lose the page:

javascript:window.open(“javascript:” +opener.window.document.documentElement.outerHTML +””);

Comment by James — February 23, 2006

Oops, the previous comment should say:

javascript:void(window.open(“javascript:” + opener.window.document.documentElement.outerHTML + ””));

Comment by James — February 23, 2006

OK, hopefully the last time (HTML and quotes were being converted):

javascript:void(window.open("javascript:'<xmp>' + opener.window.document.documentElement.outerHTML + '</xmp>'"));

Comment by James — February 23, 2006

So simple yet so cool. Dunno why I never thought of this…

Thanks for the great tip!

Comment by Jc — February 23, 2006

It works in IE and Opera. The same bookmarklet for Firefox&co is here:

javascript:''+document.getElementsByTagName("html")[0].innerHTML+'';

Comment by llook — February 23, 2006

I mean javascript:'<xmp>'+document.getElementsByTagName("html")[0].innerHTML+'</xmp>';

Comment by llook — February 23, 2006

And just for giggles, here’s all three rolled into one!

javascript:if (window.document.body.outerHTML != undefined){”+window.document.body.outerHTML+”} else if (document.getElementsByTagName(“html”)[0].innerHTML != undefined){”+document.getElementsByTagName(“html”)[0].innerHTML+”} else if (window.document.documentElement.outerHTML != undefined){”+window.document.documentElement.outerHTML+”} else { alert(‘Your browser does not support this method of viewing the page source.’) };

Comment by c@M — February 23, 2006

Sorry about the double post… forgot to escape the < and > when I posted. Duh… live preview further down on the page. Let me strap my helmet back on….

javascript:if (window.document.body.outerHTML != undefined){‘<xmp>’+window.document.body.outerHTML+'</xmp>’} else if (document.getElementsByTagName(“html”)[0].innerHTML != undefined){‘<xmp>’+document.getElementsByTagName(“html”)[0].innerHTML+'</xmp>’} else if (window.document.documentElement.outerHTML != undefined){‘<xmp>’+window.document.documentElement.outerHTML+'</xmp>’} else { alert(‘Your browser does not support this functionality’) };

Comment by c@M — February 23, 2006

Instead of using document.body.outerHTML, I would recommend using document.documentElement.outerHTML : That way, you will also get the root node of the document you’re checking.

Comment by Arve Bersvendsen — February 24, 2006

Instead I just wiggle my fingers and websites do what I need them to do

Comment by Mojoe — February 24, 2006

[…] Found a interesting little post on Ajaxian, often in the SEO bussiness you want to fund the source code as fully rendered by the browsers. This is an easy method to do so, place this code in your address bar when viewing the page. javascript:’’+window.document.body.outerHTML+’’; […]

Pingback by Search Engine Marketing Blog » See the current html state of page in IE — February 25, 2006

Great tip. I vote for the last comment by James. At least that works best for me in IE…

Comment by B@rney — September 15, 2006

Leave a comment

You must be logged in to post a comment.