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.

Sadly IE9 does the same. Curse you Microsoft! – Walf Apr 06 '11 at 07:21 — Walf, Apr 06 '11 at 07:21

score 101 · Accepted Answer · edited Apr 15 '17 at 18:52

101

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)

edited Apr 15 '17 at 18:52

Bhargav Rao

50,140
28
121
140

answered Dec 27 '09 at 13:05

Xavi

20,111
14
72
63

1

I don't have the time to go into this right now, but I'm pretty sure it's going to help me. Thanks for the step by step directions. – Pekka Dec 27 '09 at 17:01
16

I bet Microsoft Developers hate this. – alejandro Sep 06 '13 at 00:41
1

you can write debugger; straight into the js code. http://stackoverflow.com/questions/1306232/how-to-debug-javascript-with-ie-8 – ColacX Feb 02 '15 at 10:56
its nto only a good way to expose the objects, its a good way to learn some of the other stuff that i ordinarily otherwise dont use – blamb May 01 '15 at 21:03
@Xavi: Your image URL is broken. – Sebastian Feb 10 '16 at 08:49

score 93 · Answer 2 · answered Dec 30 '09 at 21:44

93

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.

answered Dec 30 '09 at 21:44

Andy

1,778
1
11
9

4

This solution is a better response to the question. By the way, if your IE does not support JSON object, you can use http://www.JSON.org/json2.js which is a nice fallback – daitangio Nov 22 '10 at 15:47
just to note, if you try to use this technique for very large variables like jquery objects for example you will likely encounter "Error: Out of memory". – jrz Aug 05 '11 at 15:14
52

**PROTIP**: Use `JSON.stringify(obj, null, "\t")` to make the output of `stringify` more readable. – Xavi May 29 '12 at 10:56
15

you can also use console.dir(); to achieve this behaviour in ie. – Chris Oct 18 '12 at 14:45
3

@Chris Wow, great tip! Works great! I had to make others aware of your great tip, so I added an answer with that info. Hope that's okay with you. :-) – René Dec 10 '12 at 18:55
If your object is large, IE limits the output. My JSON object just ended in the middle. – Nick Graham Sep 12 '18 at 14:49

score 13 · Answer 3 · answered Dec 10 '12 at 18:53

13

@Chris commented @Andy's answer with the simple solution: Use console.dir(myObj) to get all the details printed out in the console in IE. Thanks Chris!

answered Dec 10 '12 at 18:53

René

9,880
4
43
49

Yes that's okay ^^ Stupid enough i didn't post an answer. I thought there were far enough good ones in here. – Chris Dec 11 '12 at 08:53
12

console.dir is not available in IE8 :( – erotte Dec 11 '12 at 08:56
2

Also.. console.dir does not do deep serialization... JSON.stringify does – VJ. Jan 21 '13 at 10:42
1

Hm... In IE10 `console.dir(obj)` only outputs `"[object Object]"`. In IE 9 Mode it works. Thanks Microsoft... – kayahr Sep 03 '13 at 08:41

score 5 · Answer 4 · answered Aug 02 '12 at 11:57

5

If you're dealing with nasty code and console.log is not available, try this in the console:

out = []; for (i in your_object) { out.push(i) } out.join("\n")

answered Aug 02 '12 at 11:57

Cees Timmerman

17,623
11
91
124

score 3 · Answer 5 · answered Aug 11 '11 at 19:27

3

One suggestion is to use Firebug-Lite: It wraps console obj and you can see the result in IE like in most of the firebug console. Hope this help.

answered Aug 11 '11 at 19:27

winladen

69
9

1) how to install and use firebug-lite on IE and other browsers: http://www.makeuseof.com/tag/install-firebug-for-browsers-other-than-firefox 2) video on how to circumvent bookmarking issue for firebug-lite bookmarklet in IE: http://www.youtube.com/watch?v=vLJ2RaNZ22E – GuruM Sep 19 '12 at 12:47
Installed firebug-lite, but 'console is undefined' is the error message I get. Tried googling for answers but no luck yet. If anyone knows how to get rid of this problem please do reply back here. – GuruM Sep 21 '12 at 05:30

Sharad · Answer 6 · 2016-07-15T06:12:56.417

1

Add this Tag in your page :

<script type="text/javascript" src="https://getfirebug.com/firebug-lite-debug.js"></script>

And the things will work.

Its working on my system.

Note: Do try this solution.

edited Jul 15 '16 at 06:12

answered Jul 15 '16 at 06:07

Sharad

370
3
7

score 1 · Answer 7 · answered Apr 21 '17 at 11:49

1

A pictorial version of Xavi's excellent answer:

answered Apr 21 '17 at 11:49

Frison Alexander

3,228
2
29
32

score 0 · Answer 8 · answered Oct 21 '13 at 15:19

I know this is a REALLY old question, but I was looking for an answer to this just now. If it's not an absolute requirement to use the IE console (which isn't very good, IMO), then you might consider using Firebug Lite (http://getfirebug.com/firebuglite). It's not a perfect solution, and you may not want to push that script out to your production environment, and it's not as full featured as Firebug, but it's pretty good in a pinch when you have to much around with a low-end browser like IE.

if IE was not a requirement, then there would be no problems. The in-built chrome/firefox dev tools does this just fine. — Joe, Feb 12 '14 at 04:21

score 0 · Answer 9 · answered Aug 15 '14 at 17:21

0

A bit chunky but it works for DOM objects:

 console.log( testNode.outerHTML.replace(testNode.innerHTML,"") );

answered Aug 15 '14 at 17:21

br4nnigan

646
6
13

score 0 · Answer 10 · answered Nov 15 '16 at 09:52

Dump it into an existing HMTL-Element

I noticed IE 11 is stripping off console lines after 1027 chars :-/ When I had a large object to dump (12,000 chars) I dumped it into an existing DIV- oder TextArea-Element, from where I could copy the content.

var str = JSON.stringify(myObject);
$('#existing-element').text(str); // jQuery or
document.querySelector("#existing-element").innerHTML = str; // native JavaScript

score -1 · Answer 11 · answered Dec 24 '09 at 02:46

-1

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

answered Dec 24 '09 at 02:46

RyanWilcox

13,890
1
36
60

4

I don't think this deserves a downvote - it works perfectly fine, just not the way I need. Downvotes should be reserved for blatantly *wrong* answers. +1 to even it out. – Pekka Dec 27 '09 at 17:00
21

the .toString() is what the interpreter calls when you try to output an object. So basically console.log(element) is the same as console.log(element.tostring()) – naivists Dec 30 '09 at 21:47
Well, for dates, functions and arrays it works. eg "new Date().toString()" "new Date().toString.toString()" "[0, 1, 2].toString()" (without the .toString() it shows "{...}") (console.log is not necessary) – Curtis Yallop Jan 16 '15 at 20:49

How do I dump JavaScript vars in IE8?

11 Answers11

Linked