How to display entire XML from JQuery's AJAX callback function?

Question

I have this simple code to query against the web service:-

$.get( url ,  
    function(xml) {
        var hello = $(xml).find("hello").text();
        ...

        alert(xml); // displays [object XMLDocument]
        alert($(xml)); // displays [object Object]
    }                       
);

This works fine, but I'm interested to see entire XML structure from the callback function for debugging purpose. I tried a few things, but I couldn't get it to display the XML. What I want to see is something like this:-

<stuff>
    <hello>bear</hello>
</stuff>

Any clue? Thanks.

Why don't you just use Firebug? – SLaks Feb 01 '11 at 16:40 — SLaks, Feb 01 '11 at 16:40

score 5 · Accepted Answer · edited May 23 '17 at 12:32

If you are using firebug in firefox, but may also work in IE8 or chrome, you can try:

console.dirxml(xml) OR console.dir(xml) OR console.log(xml)

In IE8 press F12 to open up the developers console or you may get the error saying the normal browser doesn't know what console is (after F12 it should).

Alternatively you could use prettyPrint to display the object. Or take a look at the answer to Is there an equivalent for var_dump (PHP) in Javascript?

score 1 · Answer 2 · answered Feb 01 '11 at 16:42

1

You would need a little trickery. Introduce a new element, which wraps your XML and output the .html() from that. Like

var fakexml = "<stuff><hello>bear</hello></stuff>";

alert($('<debug>').append(fakexml).html());

or use .wrapAll()

alert($(fakexml).wrapAll('<debug>').parent().html());

answered Feb 01 '11 at 16:42

jAndy

231,737
57
305
359

I get ''Uncaught TypeError: Cannot read property 'ownerDocument' of null'' when I try to apply the ''$'' method to fakexml. – Bludwarf Dec 11 '14 at 16:58

How to display entire XML from JQuery's AJAX callback function?

2 Answers2