Two bookmarklets for debugging in IE

February 20th, 2007. Tagged: bookmarklets, firebug, IE, JavaScript, tools

Here are two bookmarklets that could make your life easier when trying to figure out why in IE a page behave as wrong as it behaves. For Firefox we have Firebug, so none of this is necessary. For IE we have also Firebug lite (see my post), but you need some setup before you can use it. With this thing here you can mess up any page you see on the web, not only yours :)

Bookmarklet 1 - Eval() textarea

I saw this bookmarklet here and it's beautiful. When you start it, it puts a textarea at the bottom of your page and you can type javascript in it, then eval()-uate it. Perfect! Only ... it doesn't work in frames. So I did the same thing but when you have frames (works without frames as well). The way mine works is - you first select some text in a frame, then you click the bookmarklet. A new textarea, ready to execute javascript will be placed in this frame (or iframe) that you selected. Also in this case when you type document.something, it refers to the document in the frame, not the frameset.
If you don't select any text and click the bookmarklet, it will place the textarea in the topmost document, so it will work for frame-free pages as well.

So here's the bookmarklet.

textarea eval

And here's a page where you can test.

Bookmarklet 2 - dump anything

After having my beautiful textarea, I wanted to be able to dump variables, like print_r() or var_dump() but for Javascript. I googled and I found this little script. All I did then is to make it a bookmarklet. How it works? You select the bookmarklet, it gives you a prompt, where you type whatever you want to dump, like document.location for example. Then it shows you an alert with all properties of this thing you typed. (Don't try to dump document though, or something else that recurses, because the script won't handle the recursion and will freeze).

Install it from here:

dump var

While this second bookmarklet will most likely work in FF as well, you don't need it, you have firebug!

Tell your friends about this post: Facebook, Twitter, Google+

7 Responses

  1. You’re my hero!

    I’ve been working on a javascript-heavy project for a bit now and these two tools will be invaluable!

  2. [...] Two bookmarklets for debugging in IE (tags: Bookmarklets Debugging IE) [...]

  3. Hi there, I recently made a few small tweaks to the Firebug lite for IE so it’s now available as a bookmarklet – this means, from IE, you can debug any web page and do the usual execution of JS and dumping of variables through Firebug:

  4. The World’s Best Bookmarklets…

    Wikipedia defines bookmarklets as "a small JavaScript program that can be stored as a URL within a bookmark in most popular web browsers." Basically, they're buttons you can add to your browser to give you a little extra function and c…

  5. How do you debug your JavaScript and CSS in IE6?…

    One trick which doesn’t often get mentioned is to use some of the clever JavaScript Bookmarklets which people have come up with. These can give you many of the features which have made Firebug so essential. These features do tend to be dotted around a…

  6. Magnificent beat ! I would like to apprentice while you amend your site, how could i subscribe for a blog website? The account aided me a applicable deal. I had been a little bit acquainted of this your broadcast provided shiny clear idea

  7. download downloaden filme 2011 online dvd downloaden ansehen filme die 2011 dvd stream dvd

Leave a Reply