jQuery XML to JSON Plugin

What is this?

The XML to JSON Plugin (jQuery.xml2json) is a script you can use to convert simple XML into a JSON object.

<xml>
<message>Hello world</message>
</xml>

{
message: 'Hello world';
}

How does it work?

var xml = '<xml><message>Hello world</message></xml>';
var json = $.xml2json(xml);
alert(json.message);

$.get('data/hello.xml', function(xml){
var json = $.xml2json(xml);
alert(json.message);
});

Why convert XML to JSON?

Those of you with a little more jQuery experience will know that in simple cases (such as the above) we could use jQuery DOM traversing functionality to achieve the same result without the need of a plugin:

alert($('<xml><message>Hello world</message></xml>').find('message').text());

However, jQuery's DOM traversing can soon become a little tiring if...
A. you frequenly process XML responses from Ajax calls
B. you parse complex/large XML documents (such as RSS feeds)
...in which case this plugin is perfect for you.

I made this plugin for my own convenience when processing XML files and I hope the benefits will become more aparent as you work your way through the examples on this page.

Consider the following XML file (data/animals.xml):

<?xml version="1.0" encoding="utf-8"?>
<animals>
<dog color='Black'>
<name>Rufus</name>
<breed>labrador</breed>
</dog>
<dog breed='whippet'>
Adopted
<name>Marty</name>
</dog>
<cat color="White">
<name>Matilda</name>
</cat>
</animals>

Simple Mode

$.get('data/animals.xml', function(xml){
var animals = $.xml2json(xml);
alert(animals.dog[1].name +'/'+ animals.dog[1]);
});

In simple mode, the plugin will only use arrays and objects when necessary. It also means you don't have to use .text (or .nodeValue) to retrieve the text of each node.

{
dog:[
{ name:'Rufus', breed:'labrador', color:'Black' },
{ text:'Adopted', name:'Marty', breed:'whippet' }
],
cat:{ name:'Matilda', color:'White'}
}

animals.dog === '{Array}';
animals.dog[0] === '{Object}'; // No text in node
animals.dog[0].name === 'Rufus';
animals.dog[0].color === 'Black';// from attribute
animals.dog[0].breed === 'labrador';
animals.dog[1] === 'Adopted'; // text in node (animals.dog[1].text)
animals.dog[1].name === 'Marty';
animals.dog[1].breed === 'whippet';
animals.cat === '{Object}'; // only 1 cat, array not required
animals.cat.name === 'Matilda';
animals.cat.color === 'White';

Extended Mode

$.get('data/animals.xml', function(xml){
var animals = $.xml2json(xml, true);
alert(animals.dog[1].name[0].text +'/'+ animals.dog[1].text);
});

In extended mode, the plugin converts each and every node into an array.

{
dog:[
{ name:['Rufus'], breed:['labrador'], color:'Black' },
{ text:'Adopted', name:['Marty'], breed:'whippet' }
],
cat:[
{ name:'Matilda', color:'White'}
]
}

animals.dog === '{Array}';
animals.dog[0] === '{Object}'; // No text in node
animals.dog[0].name[0].text === 'Rufus';
animals.dog[0].color[0].text === 'Black';// from attribute
animals.dog[0].breed[0].text === 'labrador';
animals.dog[1] === '{Object}'; // node text stored in '.text'
animals.dog[1].text === 'Adopted'; // not available in animals.dog[1]
animals.dog[1].name[0].text === 'Marty';
animals.dog[1].breed[0].text === 'whippet';
animals.cat === '{Array}';
animals.cat[0] === '{Object}';
animals.cat[0].name[0].text === 'Matilda';
animals.cat[0].color[0].text === 'White';

Download

Package:	v1.0 xml-to-json.zip previous versions -
Files:	These are the individual required files (already included in the zip package above) jQuery.xml2json.js (packed version: jQuery.xml2json.pack.js)
jQuery:	jquery-latest.js (see jQuery.com)

Installation

<script src="jquery-latest.js" type="text/javascript" language="javascript"></script>
<script src="jquery.xml2json.js" type="text/javascript" language="javascript"></script>

Support

Quick Support Links: Help me! | Report a bug | Suggest new feature

Support for this plugin is available through the jQuery Mailing List. This is a very active list to which many jQuery developers and users subscribe.
Access to the jQuery Mailing List is also available through the Nabble Forums, the jQuery Google Group and the official project page.

Related Resources

As mentioned in the introduction, you may not need this plugin if all you're going to be doing is some very simple ad-hoc XML handling. Whether or not that is the case, I thoroughly recommend this amazing article:
Easy XML handling with jQuery (without a plugin)

Feel free to post suggestions in the jQuery Mailing List. (Yes, I will check it!)

Give credit where credit is due...

• Diego A. - Author, Professional Web Design London
• Dean Edwards - Author of JS Packer used to compress the plugin
• Inspired by TerraCoder.com and Thomas Frank
• Some sample XML files from w3schools.com

Attribute this work

License Info

XML to JSON Plugin by Fyneworks.com is licensed under the MIT License and the GPL License.

Copyright © 2008 Fyneworks.com Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.