Anand Jha
Anand Jha

Reputation: 10714

convert xml to json in Javascript

I have the following javascript function (which I got from Stack Overflow) which converts XML to JSON:

function xmlToJson(xml) {
    try {
        var obj = {};
        if (xml.nodeType == 1) {
            if (xml.attributes.length > 0) {
                for (var j = 0; j < xml.attributes.length; j++) {
                    var attribute = xml.attributes.item(j);

                    obj[attribute.nodeName] = attribute.nodeValue;
                }
            }
        } else if (xml.nodeType == 3) {
            obj = xml.nodeValue;
        }

        if (xml.hasChildNodes()) {
            for (var i = 0; i < xml.childNodes.length; i++) {
                var item = xml.childNodes.item(i);
                var nodeName = item.nodeName;

                if (typeof (obj[nodeName]) == "undefined") {
                    obj[nodeName] = xmlToJson(item);
                } else {
                    if (typeof (obj[nodeName].push) == "undefined") {
                        var old = obj[nodeName];

                        obj[nodeName] = [];
                        obj[nodeName].push(old);
                    }

                    obj[nodeName].push(xmlToJson(item));
                }
            }
        }

        console.log(JSON.stringify(obj));
        return obj;
    } catch (e) {
        alert(e.message);
    }
}

What I want is to return it as an array ([]) when a xml node has at-least single child node and it has a parent node also. In this code it returns map ({}) if xml node has single child node but it is fine with multiple child nodes.

For example, I'd like the XML

<pnode attr1="abc">
    <cnode attr2="xyz"></cnode>
</pnode>

to be transformed into the JSON

{
    "pnode": {
        "attr1": "abc"
    },
    "cnode": [
        {"attr2": "xyz"}
    ]
}

Upvotes: 3

Views: 7369

Answers (2)

Paul S.
Paul S.

Reputation: 66304

With the clarification about what you want to achieve, here is an algorithm. I'll leave my other answer up because I still think the wisest choice is not to play with the structure

function flattenNodes(node, isChild) {
    var obj = {}, obj2, i, key, attributes = {};
    if (node.attributes && node.attributes.length)
        for (i = 0; i < node.attributes.length; ++i)
            attributes[node.attributes[i].nodeName] = node.attributes[i].nodeValue;
    if (!isChild)
        obj[node.nodeName] = attributes;
    else {
        if (!obj.hasOwnProperty(node.nodeName))
            obj[node.nodeName] = [];
        else if (!(obj[node.nodeName] instanceof Array))
            obj[node.nodeName] = [obj[node.nodeName]];
        obj[node.nodeName].push(attributes);
    }
    attributes = null; // free
    if (node.childNodes && node.childNodes.length)
        for (i = 0; i < node.childNodes.length; ++i) {
            if (node.childNodes[i].nodeType === 3) continue; // skip text node
            obj2 = flattenNodes(node.childNodes[i], 1); // recurse
            for (key in obj2) // merge
                if (obj2.hasOwnProperty(key))
                    if (!obj.hasOwnProperty(key)) {
                        obj[key] = obj2[key];
                    } else {
                        if (!(obj[key] instanceof Array))
                            obj[key] = [obj[key]];
                        obj[key] = obj[key].concat(obj2[key]);
                    }
        }
    return obj;
}

Example usage on Node root_node

var root_node;
root_node = new DOMParser().parseFromString(
    '<pnode attr1="abc"><cnode attr2="xyz"></cnode></pnode>',
    'text/xml'
).documentElement;

var o = flattenNodes(root_node); // create
JSON.stringify(o);               // to JSON
// {"pnode":{"attr1":"abc"},"cnode":[{"attr2":"xyz"}]}

If you have XML of the form <foo bar="baz"><foo hello="world"></foo></foo>, the first iteration will cause {foo: {bar: "baz"}}, then the second encounter will modify this to the array form of {foo: [{bar: "baz"}, {hello: "world"}]}

Upvotes: 2

Paul S.
Paul S.

Reputation: 66304

I would form the object representing the XML differently;

Integer  nodeType
String   nodeName
String   nodeValue
Array    childNodes
Object   attributes

Now you can have the same form independent of number of child nodes/etc

function nodeToObject(node) {
    var obj = {}, i;
    obj.nodeType = node.nodeType;
    obj.nodeName = node.nodeName;
    obj.nodeValue = node.nodeValue;
    obj.childNodes = [];
    obj.attributes = {};
    if (node.childNodes && node.childNodes.length)
        for (i = 0; i < node.childNodes.length; ++i)
            obj.childNodes.push(nodeToObject(node.childNodes[i]));
    if (node.attributes && node.attributes.length)
        for (i = 0; i < node.attributes.length; ++i)
            obj.attributes[node.attributes[i].nodeName] = node.attributes[i].nodeValue;
    return obj;
}

And then to transform root_node to JSON,

JSON.stringify(nodeToObject(root_node));

Going in the opposite direction is also possible in JavaScript, with some minor logic based upon nodeType to choose the creation method.

Upvotes: 0

Related Questions