将JavaScriptXMLDOM对象转换为具有一定结构的对象

Question

我有一个大的 XML DOM 对象，它是通过 jQuery 的 $.parseXML 函数解析的，返回一个 JavaScript DOM目的。使用此 XML 我想创建一个具有以下结构的普通 JavaScript 对象：

{
    name: 'my_tree',
    children: [
        { name: 'hello' },
        { name: 'wat' },
        {
            name: 'child_folder',
            children: [
                {
                    name: 'child_folder',
                    children: [
                        { name: 'hello' },
                        { name: 'wat' }
                    ]
                },
                { name: 'hello' },
                { name: 'wat' },
                {
                    name: 'child_folder',
                    children: [
                        { name: 'hello' },
                        { name: 'wat' }
                    ]
                }
            ]
        }
    ]
}

原来的 XML 看起来像这样：

<my_tree>
    <hello></hello>
    <wat></wat>
    <child_folder>
        <child_folder>
            <hello></hello>
            <wat></wat>
        </child_folder>
        <hello></hello>
        <wat></wat>
        <child_folder>
            <hello></hello>
            <wat></wat>
        </child_folder>
    </child_folder>
</my_tree>

我试过类似下面的代码，但没有成功：

function xmlDomToObject(domObject) {
    var result = {children: []};
    for (var i = 0; i < domObject.length; i++) {
        if (domObject[i].nodeName == "#text") {
            continue;
        }

        result['name'] = domObject[i].nodeName;
        result['children'].push(xmlDomToObject(domObject[i].childNodes));
    }

    return result;
}

var xmlObject = xmlDomToObject(xmlDomObject.childNodes);

Answer 1

下面是一种可能的方法。使用 children（而不是 childNodes）属性允许绕过文本节点并仅检查元素：

function parseXml(node) {
  const el = {
    name: node.nodeName
  };

  const children = Array.prototype.map.call(node.children, parseXml);
  // ES6: const children = [...node.children].map(parseXml);
  if (children.length) {
    el.children = children;
  }

  return el;
}

您可以按原样使用它，只需记住传递 $.parseXML 结果的 documentElement 属性，而不是结果本身。

const xmlStr = `<my_tree>
    <hello></hello>
    <wat></wat>
    <child_folder>
        <child_folder>
            <hello></hello>
            <wat></wat>
        </child_folder>
        <hello></hello>
        <wat></wat>
        <child_folder>
            <hello></hello>
            <wat></wat>
        </child_folder>
    </child_folder>
</my_tree>`;

const xml = $.parseXML(xmlStr);
const parsed = parseXml(xml.documentElement);

console.log(parsed);

function parseXml(node) {
  const el = {
    name: node.nodeName
  };

  // const children = [...node.children].map(parseXml);
  const children = Array.prototype.map.call(node.children, parseXml);
  if (children.length) {
    el.children = children;
  }
 
  return el;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

将JavaScriptXMLDOM对象转换为具有一定结构的对象

Convert JavaScript XML DOM Object to Object with certain structure

javascript

xml

xmldom

xml-parsing