将xml文件读入csv格式答案

【问题标题】：Read xml file into csv format将xml文件读入csv格式
【发布时间】：2017-10-12 22:44:39
【问题描述】：

我正在尝试将以下 xml 内容解析为 csv 格式：

<order>
  <item>abc</item>
  <item>123</item>
  <item/>
  <item>000</item>
</order>
<order>
  <item>999</item>
  <item>333</item>
</order>

我能够使用 FileApi 读取 xml 文件。变量 text 保存 xml 内容。您能否提供一些关于如何将每个 <order> 标记解析为数组的见解？

<!doctype html>
<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#fileUpload").change(function () {
                for (var i = 0; i < this.files.length; i++) {

                    var reader = new FileReader();
                    reader.onload = function(e) {
                      var text = reader.result; 
                    }
                    reader.readAsText(this.files[i]);

                    //TODO
                    //1. find tag <order> 
                    //2. get all <item> text into an array
                    //3. separate array elements with a semicolon
                    //4. show array content in the div dataContainer + <br>
                    //5. repeat until there is no more <order> tags to parse

                }
            });
        });
    </script>
</head>
<body>
    <input type="file" id="fileUpload" multiple="multiple" />
    <div id="dataContainer"></div>
</body>
</html>

这是在 div dataContainer 中显示的预期输出：

abc;123;;000
999;333

【问题讨论】：

标签： javascript jquery xml

【解决方案1】：

您可以使用.find() 获取<order> 元素，.each() 迭代<item> 元素，连接每个元素的.textContent

let xml = `<?xml version="1.0" encoding="UTF-8"?>
<root>
  <order>
    <item>abc</item>
    <item>123</item>
    <item/>
    <item>000</item>
  </order>
  <order>
    <item>999</item>
    <item>333</item>
  </order>
</root>`;

let str = "";

$(xml)
  .find("order")
  .each(function() {
    let item = $(this).find("item");
    item.each(function(i, el) {
      str += el.textContent + (i < item.length - 1 ? ";" : "");
    });
    str += "\n";
  });

console.log(str);

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

【讨论】：

【解决方案2】：

为什么不将数据存储在Document 中，然后像使用任何其他 DOM 一样对其进行迭代？你想做的有点像MDN's example of doing exactly that:

var sMyString = '<a id="a"><b id="b">hey!</b></a>';
var oParser = new DOMParser();
var oDOM = oParser.parseFromString(sMyString, "text/xml");

orders = oDOM.getElementsByTagName("order");
for (i = 0; i < orders.length(); i++) {
    // Do stuff
}

或者，如果您觉得更勇敢一点，您可以将 XPath 引用与 oDOM 对象一起使用。

【讨论】：