js使用递归解析xml

以下是详细讲解“js使用递归解析xml”的完整攻略：

步骤一：获取XML数据

首先，你需要获取到一个XML的数据源。可以使用AJAX或其他的网络请求方式来获取XML数据。下面是一个使用AJAX获取XML数据的示例代码：

function loadXMLDoc(filename) {
  let xhttp = new XMLHttpRequest();
  xhttp.open("GET", filename, false);
  xhttp.send();
  return xhttp.responseXML;
}

let xmlDoc = loadXMLDoc("example.xml");

步骤二：编写递归函数解析XML

接下来，你需要编写一个递归函数来解析XML并生成JSON格式的数据。下面是一个示例代码：

function xmlToJson(xml) {
  // Create the return object
  let obj = {};

  if (xml.nodeType == 1) { // element
    // do attributes
    if (xml.attributes.length > 0) {
      obj["@attributes"] = {};
      for (let j = 0; j < xml.attributes.length; j++) {
        let attribute = xml.attributes.item(j);
        obj["@attributes"][attribute.nodeName] = attribute.nodeValue;
      }
    }
  } else if (xml.nodeType == 3) { // text
    obj = xml.nodeValue;
  }

  // do children
  if (xml.hasChildNodes()) {
    for (let i = 0; i < xml.childNodes.length; i++) {
      let item = xml.childNodes.item(i);
      let nodeName = item.nodeName;
      if (nodeName == "#text") continue;
      if (obj[nodeName] == null) {
        obj[nodeName] = xmlToJson(item);
      } else {
        if (obj[nodeName].push == null) {
          let old = obj[nodeName];
          obj[nodeName] = [];
          obj[nodeName].push(old);
        }
        obj[nodeName].push(xmlToJson(item));
      }
    }
  }
  return obj;
}

let data = xmlToJson(xmlDoc);

示例一：解析单级XML数据

以下是一个单级XML数据的示例，可以用上述递归函数解析：

<books>
  <book>
    <title>JavaScript权威指南</title>
    <author>David Flanagan</author>
    <year>2006</year>
  </book>
  <book>
    <title>JavaScript DOM编程艺术</title>
    <author>Jeremy Keith</author>
    <year>2005</year>
  </book>
  <book>
    <title>高性能JavaScript</title>
    <author>Nicholas C. Zakas</author>
    <year>2010</year>
  </book>
</books>

解析结果将会是一个JSON格式的对象：

{
  "books": {
    "book": [
      {
        "title": "JavaScript权威指南",
        "author": "David Flanagan",
        "year": "2006"
      },
      {
        "title": "JavaScript DOM编程艺术",
        "author": "Jeremy Keith",
        "year": "2005"
      },
      {
        "title": "高性能JavaScript",
        "author": "Nicholas C. Zakas",
        "year": "2010"
      }
    ]
  }
}

示例二：解析带有嵌套子节点的XML数据

以下是一个带有嵌套子节点的XML数据的示例，可以用上述递归函数解析：

<person>
    <name>John Doe</name>
    <email>[e-mail]</email>
    <phone type="home">212 555-1234</phone>
    <phone type="work">646 555-4567</phone>
    <address>
        <street>123 Main St.</street>
        <city>New York</city>
        <state>NY</state>
        <zip>10001</zip>
    </address>
</person>

解析结果将会是一个JSON格式的对象：

{
  "person": {
    "name": "John Doe",
    "email": "[e-mail]",
    "phone": [
      {
        "@attributes": {
          "type": "home"
        },
        "#text": "212 555-1234"
      },
      {
        "@attributes": {
          "type": "work"
        },
        "#text": "646 555-4567"
      }
    ],
    "address": {
      "street": "123 Main St.",
      "city": "New York",
      "state": "NY",
      "zip": "10001"
    }
  }
}

这样，你就可以通过递归函数解析XML数据并生成JSON格式的数据了。