ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScriptでXMLをJSONに変換する方法

JavaScriptでXMLをJSONに変換する方法

青灯夜游
青灯夜游オリジナル
2021-04-07 15:37:365569ブラウズ

JavaScript で XML を JSON 文字列に変換する方法: 最初に XML 文字列を通じて XML DOM オブジェクトを取得するか、XML ファイルをリクエストします。次に、トラバーサルと再帰を通じてサブ要素の nodeValue 値を取得し、最後にスプライスアウトします。単なる JSON 文字列です。

JavaScriptでXMLをJSONに変換する方法

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

JavaScript を使用して XML を JSON に変換します

まず、XML 文字列を通じて XML DOM オブジェクトを生成します:

/**
 * 通过传入xml的内容字符串来解析xml
 * @param xmlString xml字符串
 * @returns xml的Document对象
 */
function getXmlDocumentByXmlString(xmlString) {
    var xmlDoc = null;
    if (window.DOMParser) {
        var parser = new DOMParser();
        xmlDoc = parser.parseFromString(xmlString, "text/xml");
    } else {
        //IE
        xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async = "false";
        xmlDoc.loadXML(xmlString);
    }
    return xmlDoc;
}

または、XML ファイルをリクエストして取得しますXML の DOM オブジェクト:

/**
 * 通过传入xml文件路径来解析xml文档
 * @param xmlFilePath xml文档路径,如:files/test.xml
 * @returns xml的Document对象
 */
function getXmlDocumentByFilePath(xmlFilePath) {
    //xmlDocument对象
    var xmlDoc = null;
    //xmlhttp对象
    var xmlhttp = null;
    if (window.XMLHttpRequest) {
        //IE7+, FireFox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        //IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.open("GET", xmlFilePath, false);
    xmlhttp.send();
    xmlDoc = xmlhttp.responseXML;
    return xmlDoc;
}

次のステップが重要な部分です。サブ要素の nodeValue を走査して再帰的に取得することで、JSON 文字列を分割し、XML を JSON 文字列に変換できます。

/**
 * 将XML的Document对象转换为JSON字符串
 * @param xmlDoc xml的Document对象
 * @return string
 */
function convertToJSON(xmlDoc) {
    //准备JSON字符串和缓存(提升性能)
    var jsonStr = "";
    var buffer = new Array();

    buffer.push("{");
    //获取xml文档的所有子节点
    var nodeList = xmlDoc.childNodes;

    generate(nodeList);

    /**
     * 中间函数,用于递归解析xml文档对象,并附加到json字符串中
     * @param node_list xml文档的的nodeList
     */
    function generate(node_list) {

        for (var i = 0; i < node_list.length; i++) {
            var curr_node = node_list[i];
            //忽略子节点中的换行和空格
            if (curr_node.nodeType == 3) {
                continue;
            }
            //如果子节点还包括子节点,则继续进行遍历
            if (curr_node.childNodes.length > 1) {
                buffer.push("\"" + curr_node.nodeName + "\": {");
                generate(curr_node.childNodes);
            } else {
                var firstChild = curr_node.childNodes[0];

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

            }
            if (i < (node_list.length - 2)) {
                buffer.push(",");
            } else {
                break;
            }
        }
        //添加末尾的"}"
        buffer.push("}");
    }

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

Usage: getXmLDocumentByFilePath(xmlFilePath) または getXmlDocumentByXmlString(xmlString) を通じて XML ドキュメント オブジェクトを取得し、convertToJSON を呼び出します。 (xmlDocument )xml の Ducument オブジェクトを渡して、変換された JSON 文字列を取得します。

適用範囲: 属性を含まない任意の XML ドキュメント。

プログラミング関連の知識について詳しくは、プログラミング ビデオをご覧ください。 !

以上がJavaScriptでXMLをJSONに変換する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。