在 JavaScript 中从 JSON 构建 XML 格式答案

【问题标题】：build XML format from JSON in JavaScript在 JavaScript 中从 JSON 构建 XML 格式
【发布时间】：2017-02-20 15:04:15
【问题描述】：

我正在尝试根据我的 JSON 生成 XML 格式，而不是尝试将其从 JSON 转换为 XML。

我正在尝试生成 XML 的 JSON 示例

var jObj = { "Smart Shoes":{  
      "Product":"Smart Shoes",
      "Price":24.99,
      "Quantity":"1x "
   },
   "Denim Jeans":{  
      "Product":"Denim Jeans",
      "Price":30,
      "Quantity":"1x "
   }
}

尝试以如下格式生成 XML。

<xml id="POSCMD" LateProcessing="true">
 <commands>
  <injectfieldmacro type="field" name="FIELD_CLEAR"/>
  forEach(Item in Basket) {
    <injectdata type="literal" data="{Item.UPC}"/>
    <injectfieldmacro type="field" name="FIELD_UPC"/>
  }
 </commands>
</xml>

Plnkr

【问题讨论】：

你想在哪里做这个？在浏览器中？本地？节点JS？ XML 数据库？
浏览器，生成的xml onclick().
请在问题本身的minimal reproducible example 中提供所有相关代码，而不是在第三方网站上。

标签： javascript json xml

【解决方案1】：

您可以使用 JavaScript（或 jQuery）以 DOM 样式的方式直接创建 XML 元素。我觉得这种方法比创建字符串要好，因为这种方法会处理正确的格式和封装。

这是一个 JavaScript 示例：

var jObj = { "Smart Shoes":{  
      "Product":"Smart Shoes",
      "Price":24.99,
      "Quantity":"1x "
   },
   "Denim Jeans":{  
      "Product":"Denim Jeans",
      "Price":30,
      "Quantity":"1x "
   }
};

var xml = document.createElement("xml");
xml.setAttribute("id","POSCMD");
xml.setAttribute("LateProcessing","true");
var commands = document.createElement("commands");
xml.appendChild(commands);
var injFM = document.createElement("injectfieldmacro");
injFM.setAttribute("type","field");
injFM.setAttribute("name","FIELD_CLEAR");
commands.appendChild(injFM);
var injData;
for (var item in jObj) {
    injData = document.createElement("injectdata");
    injData.setAttribute("type","literal");
    injData.setAttribute("data",JSON.stringify(jObj[item]));
    injFM = document.createElement("injectfieldmacro");
    injFM.setAttribute("type","field");
    injFM.setAttribute("name","FIELD_UPC");
    commands.appendChild(injData);
    commands.appendChild(injFM);
}

// Append XML to DOM
var body = document.getElementsByTagName("body")[0];
body.appendChild(xml);

我刚刚编写了将 JSON 对象数据粘贴到数据字段中的代码，因为它并不清楚您要如何继续。但是，如果您希望/需要将数据拆分为多个“injectdata”XML 元素，下面的代码至少应该提供足够的信息来扩展。

编辑： 我编辑了 sn-p，因此 XML 直接附加到 DOM 正文标记。当您运行 sn-p 时，如果您右键单击 iframe 并检查，您应该会看到这些元素实际放入 DOM：

【讨论】：

谢谢，会看看。为什么不像其他答案那样使用字符串？
要实现这一点需要等待不止一个。制作字符串是最基本的方法。它“又快又脏”而且有效。问题是字符串格式可能会变得混乱和复杂。您的问题的措辞方式对我来说听起来就像您正在寻找一个不构建字符串的选项。原生 JavaScript DOM 函数也可用于生成 XML。此外，最后的功能只是将 XML 转换为格式以打印到浏览器以显示它的外观。这不是解决方案代码的一部分。
谢谢，做了一点改动。代替document.write 有没有办法在IE7 中附加XML？目前它正在编写 XML，但它封装在 "<xml>"
您要在哪里附加 XML？如果要选择 XML 中的所有内容，可以使用 var commands = document.getElementsByTagName("commands")[0];。如果您想直接将其附加到文档中，您可以使用document.append(commands);。问题是，一旦你这样做了，你能看到 XML 的唯一方法就是检查页面。
让我们continue this discussion in chat.

【解决方案2】：

又快又脏。

var gen = function() {
    var jObj = {"Smart Shoes":{"Product":"Smart Shoes","Price":24.99,"Quantity":"1x "},"Denim Jeans":{"Product":"Denim Jeans","Price":30,"Quantity":"1x "}}
    var xmlString = '<xml id="POSCMD" LateProcessing="true"><commands><injectfieldmacro type="field" name="FIELD_CLEAR"/>';

    for (var item in jObj) {
      if (jObj.hasOwnProperty(item)) {
        xmlString += '<injectdata type="literal" data="' + jObj[item].Price + '"/>'; // I don't know where you got UPC from
        xmlString += '<injectfieldmacro type="field" name="FIELD_UPC"/>'
      }
    }

    xmlString += '</commands></xml>';

    console.log(xmlString);
}

这将生成有效的 XML，如下所示：

<?xml version="1.0" encoding="UTF-8"?>
<xml id="POSCMD" LateProcessing="true">
   <commands>
      <injectfieldmacro type="field" name="FIELD_CLEAR" />
      <injectdata type="literal" data="24.99" />
      <injectfieldmacro type="field" name="FIELD_UPC" />
      <injectdata type="literal" data="30" />
      <injectfieldmacro type="field" name="FIELD_UPC" />
   </commands>
</xml>

不过，我建议将您的对象/数组转换为 xml。

【讨论】：