How do I dump JavaScript vars in IE8?

Question

I have an object I need to examine in IE8. I tried the developer tools and console.log, their Firebug equivalent. However, when I output the object to the log:

console.log("Element: ", element);
console.log(element);

I only get the string

LOG: Element: [object Object]

instead of a clickable, examinable dump.

Is it possible to dump an object to the Log and examine its members, like in Firebug?

I can't use a homemade dump() function because the element I want to examine is so huge the browser will crash on me.

Answer 1

console.log(element.toString()) might be your friend here...

Answer 2

Here's one technique that I've found helpful:

• Open the Developer Tool Bar (hit F12)
• Go to the "Script" tab
• Click the "Start Debugging" button
• Next, type "debugger" into the console and hit enter. This should trigger a break point.
• Go to the "Watch" sub-tab
• Click the row that says, "Click to add..." and enter a variable you'd like to examine. Note that the variable must be globally available.
• At this point you should be able to examine your variable with tree-like UI
• Once you're done debugging click Continue button (or hit F5)

Here's a screen shot that highlights some of the UI elements I mentioned:

Answer 3

A bit off topic (as it won't work for DOM elements) but I've found it handy to use the JSON.stringify(object) to get a JSON string for the object which is pretty readable.