Using JavaScript to convert XML to JSON

Keywords: xml JSON github Database

Recently, there is a requirement in developing projects. The strings of XML messages queried from the database need to be parsed with parameters, which supports modification on the page. Therefore, the function of parsing XML text using JavaScript is born.
The specific idea is to get the DOM object of XML, and then through traversal and recursion to get the nodeValue of sub elements, to splice the JSON string.

Generate DOM object of XML through XML string:

 * Parsing xml through the content string passed in xml
 * @param xmlString xml character string
 * @returns xml Document object for
function getXmlDocumentByXmlString(xmlString) {
    var xmlDoc = null;
    if (window.DOMParser) {
        var parser = new DOMParser();
        xmlDoc = parser.parseFromString(xmlString, "text/xml");
    } else {
        xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async = "false";
    return xmlDoc;

Or get the DOM object of XML by requesting XML file:

 * Parsing xml documents by passing in xml file path
 * @param xmlFilePath xml Document path, such as files/test.xml
 * @returns xml Document object for
function getXmlDocumentByFilePath(xmlFilePath) {
    //xmlDocument object
    var xmlDoc = null;
    //xmlhttp object
    var xmlhttp = null;
    if (window.XMLHttpRequest) {
        //IE7+, FireFox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        //IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }"GET", xmlFilePath, false);
    xmlDoc = xmlhttp.responseXML;
    return xmlDoc;

Next, we will focus on converting XML to JSON string:

 * Convert the Document object of XML to a JSON string
 * @param xmlDoc xml Document object for
 * @return string
function convertToJSON(xmlDoc) {
    //Prepare JSON strings and cache (improve performance)
    var jsonStr = "";
    var buffer = new Array();

    //Get all child nodes of xml document
    var nodeList = xmlDoc.childNodes;


     * Intermediate function, used to recursively parse xml document objects and attach them to json strings
     * @param node_list xml nodeList of the document
    function generate(node_list) {

        for (var i = 0; i < node_list.length; i++) {
            var curr_node = node_list[i];
            //Ignore line breaks and spaces in child nodes
            if (curr_node.nodeType == 3) {
            //If the child node also includes child nodes, continue traversal
            if (curr_node.childNodes.length > 1) {
                buffer.push("\"" + curr_node.nodeName + "\": {");
            } else {
                var firstChild = curr_node.childNodes[0];

                if (firstChild != null) {
                    //nodeValue is not null
                    buffer.push("\"" + curr_node.nodeName + "\":\"" + firstChild.nodeValue + "\"");
                } else {
                    //nodeValue is null
                    buffer.push("\"" + curr_node.nodeName + "\":\"\"");

            if (i < (node_list.length - 2)) {
            } else {
        //Add "}" at the end

    jsonStr = buffer.join("");
    return jsonStr;

Usage: get the Document object of XML through getXmLDocumentByFilePath(xmlFilePath) or getXmlDocumentByXmlString(xmlString), and then get the converted JSON string by calling convertToJSON(xmlDocument) into the Ducument object of XML.

Scope of application: any XML document without attribute.

At present, it is only the first version of XML to JSON tool, which may have many shortcomings and needs to be improved. Welcome to exchange. I will update the latest code on GitHub, project address: Welcome to ask questions!

Posted by matts12290 on Tue, 05 May 2020 15:32:19 -0700