XML DOM 中缺少节点 - 简单示例答案

【问题标题】：Missing nodes in XML DOM - simple exampleXML DOM 中缺少节点 - 简单示例
【发布时间】：2016-11-27 08:40:59
【问题描述】：

表格不会呈现，因为 .XML 文档缺少 UNIT 3 中 QUANTITY 的节点。

我们如何跳过 XML DOM 中缺失的节点？

XML 文档 (example.xml)

<?xml version="1.0" encoding="UTF-8"?>
<CUSTOMER_ORDER>
    <UNIT>
        <ID>Unit 1</ID>
        <QUANTITY>45</QUANTITY>
        <PRICE>25.99</PRICE>
    </UNIT>
    <UNIT>
        <ID>Unit 2</ID>
        <QUANTITY>209</QUANTITY>
        <PRICE>9.95</PRICE>
    </UNIT>
    <UNIT>
        <ID>Unit 3</ID>   <!-- The QUANTITY node for Unit 3 is missing -->
        <PRICE>14.99</PRICE>
    </UNIT>
    <UNIT>
        <ID>Unit 4</ID>
        <QUANTITY>156</QUANTITY>
        <PRICE>35.88</PRICE>
    </UNIT>
    <UNIT>
        <ID>Unit 5</ID>
        <QUANTITY>25</QUANTITY>
        <PRICE>199.00</PRICE>
    </UNIT>
</CUSTOMER_ORDER>

这是 XML DOM（带有 HTML）

<!DOCTYPE html>
<html>
<style>
table,th,td {
  border : 2px solid black;
  border-collapse: collapse;
}
th,td {
  padding: 5px;
}
</style>
<body>

<body onload="loadXMLDoc()">

<table id="test"></table>

<script>
function loadXMLDoc() {
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
     testFunction(xmlhttp);
    }
  };
  xmlhttp.open("GET", "example.xml", true);
  xmlhttp.send();
}
function testFunction(xml) {
  var table="<tr><th>Unit</th><th>Price</th><th>Quantity</th></tr>";
  var xmlDoc = xml.responseXML;
  var i;
  var y = xmlDoc.getElementsByTagName("UNIT");
  for (i = 0; i < y.length; i++) 
  {
  var u = y[i].getElementsByTagName("ID")[0].childNodes[0].nodeValue;
  var p = y[i].getElementsByTagName("PRICE")[0].childNodes[0].nodeValue;
  var q = y[i].getElementsByTagName("QUANTITY")[0].childNodes[0].nodeValue;

    table += "<tr><td>" +
    u +                         // Unit ID column
    "</td><td>" +
    p +                         // PRICE column
    "</td><td>" +
    q +                         // QUANTITY column
    "</td></tr>";
   }
  document.getElementById("test").innerHTML = table;
}
</script>

</body>
</html>

【问题讨论】：

这是你自己的代码，它假设总会有一个“QUANTITY”元素。只需在查找值之前检查是否存在。
这似乎是一个合理的解决方案。你会怎么做？
在继续之前测试一下y[i].getElementsByTagName("QUANTITY").length是否至少是1。
感谢您的提示。

标签： javascript html xml dom

【解决方案1】：

就像@Pointy 所说的那样，在设置 q 之前检查是否有数量，如果缺少 QUANTITY，则将默认值设置为 1 或您希望的任何值。

替换这个：

var q = y[i].getElementsByTagName("QUANTITY")[0].childNodes[0].nodeValue;

与：

var qElem = y[i].getElementsByTagName("QUANTITY"); //Get quantity elems
var q = (qElem.length > 0) ? qElem[0].childNodes[0].nodeValue : 1; //Check if there is anything in qElem if not set q to 1

这应该可行。

【讨论】：

难以置信！感谢这个完美的答案。
很高兴我能帮上忙。