Search code examples
javascriptjqueryxmlcdata

How do I properly convert XML to JS Objects while properly containing CDATA


I am trying to build an RSS reader web-based app. The issue I'm having is that when I read the XML from the RSS and convert it to a javascript object; anything wrapped in [![CDATA]] gives me an undefined object. Here's what I'm using:

function XML2jsobj(node) {

var data = {};

// append a value
function Add(name, value) {
    if (data[name]) {
        if (data[name].constructor != Array) {
            data[name] = [data[name]];
        }
        data[name][data[name].length] = value;
    }
    else {
        data[name] = value;
    }
};

// element attributes
var c, cn;
for (c = 0; cn = node.attributes[c]; c++) {
    Add(cn.name, cn.value);
}

// child elements
for (c = 0; cn = node.childNodes[c]; c++) {
    if (cn.nodeType == 1) {
        if (cn.childNodes.length == 1 && cn.firstChild.nodeType == 3) {
            // text value
            Add(cn.nodeName, cn.firstChild.nodeValue);
        }
        else {
            // sub-object
            Add(cn.nodeName, XML2jsobj(cn));
        }
    }
}

return data;

}

var url = "http://rss.cnn.com/rss/cnn_world.rss";
var url1 = "https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20xml%20where%20url%20%3D%20'"+url+"'";
function getWithJQ2(){
    $.get(url1, function (data) {
        console.log("data:",data);
        var items = XML2jsobj(data.getElementsByTagName('channel')[0]);
        responseFeed = items;
            console.log("First article:",responseFeed.item[0]);



        console.log("items:",items);


    });
}

The RSS feed I'm using is http://rss.cnn.com/rss/cnn_world.rss. As previously stated, all objects are properly created, however if you notice; the tags are wrapped around CDATA and a quick look in console shows them to be empty objects. I'm not too sure if I gave enough information about this problem but I've been stuck on this for a while.


Solution

  • The nodeType of a CDATA section is 4, so you can get your current code to work by checking for that in the same place you check for text nodes.

    Before:

    if (cn.childNodes.length == 1 && cn.firstChild.nodeType == 3) {
    

    After:

    if (cn.childNodes.length == 1 && 
        (cn.firstChild.nodeType == 3 || cn.firstChild.nodeType === 4)) {