Create properly formatted XML from DOM in JavaScript


Staff member
I'm having troubles taking the DOM document (or a node in it) and serialize it as properly formatted xml. I need to do this as the tools I will upload part of the document to understands only XML and not HTML with its improperly closed elements. As an example I'm currently scraping (amongst many) <a href="" rel="nofollow"></a> which showcases my problems with img elements not being closed.

For example if I execute the following in chromes console:

$('&lt;div&gt;').append($('body ul:first li:last')).html()

I'll receive:

&lt;li&gt;&lt;a href=""&gt;&lt;img src="
content/themes/studentlund/pics/rss.png" alt="RSS"&gt;&lt;/a&gt;&lt;/li&gt;

The img element is not closed, thus my xml parser will fail.

If I use the XMLSerializer:

n = $('body ul:first li:last').get(0)
new XMLSerializer().serializeToString(n)

I will get the same, incorrectly formatted XML:

&lt;li&gt;&lt;a href=""&gt;&lt;img src="" alt="RSS"&gt;&lt;/a&gt;&lt;/li&gt;

All I want is being able to dump the RAW DOM of a node in a properly formatted string of XML so I can use it with my XML tools, is this possible?