使用 Javascript 解析 XML（最终在 phonegap 中使用）

Question

我正在尝试在 javascript 中解析一些 XML 结果以与 phonegap 一起使用。就目前而言，我的 xml 布局是：

<Results>
     <Result>
          <FirstName>John</FirstName>
          <Surname>Beech</Surname>
          <Company>CompanyName</Company>
          <Job_Title>Property Department</Job_Title>
          <UserID>184</UserID>
          <CompanyID>CompanyID</CompanyID>
          </Result>
     <Result>
          <FirstName>Rosie</FirstName>
          <Surname>Beech</Surname>
          <Company>CompanyName</Company>
          <Job_Title>Job Title</Job_Title>
          <UserID>10494</UserID>
          <CompanyID>17322</CompanyID>
     </Result>
</Results>

我目前正在使用以下 javascript 来提醒响应，但最终我想创建一个响应表。

<script language="javascript" type="text/javascript">
    window.onload = function () {
        $.ajax({
            type: 'GET',
            url: 'Lookupbysurname.aspx?surname=beech',
            dataType: 'html',
            success: function (data) {


                try {
                    xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
                    xmlDoc.async = "false";
                    xmlDoc.loadXML(data);
                }
                catch (e) {
                    try {
                        parser = new DOMParser();
                        xmlDoc = parser.parseFromString(data, "text/xml");
                    }
                    catch (e) {
                        alert(e.message);
                        return;
                    }
                }

                for (var i = 0; i < xmlDoc.getElementsByTagName("CompanyID")[0].childNodes[0].length; i++) {
                    alert(xmlDoc.getElementsByTagName("CompanyID")[0].childNodes[0].nodeValue);
                }
            }
        });
    }
</script>

但是，目前它只是一遍又一遍地提醒相同的响应。我把循环放在一起错了吗？ JS 中的循环不是我的强项！任何帮助将不胜感激。

Answer 1

您可以通过使用XMLHttpRequest 的responseXML 属性来避免使用parseXML()，该属性封装在jQuery 中，如下所示：

$.ajax({
    type: 'GET',
    url: 'Lookupbysurname.aspx?surname=beech',
    dataType: 'xml',
    success: function(xmlDoc) {
        alert(xmlDoc.getElementsByTagName("CompanyID")[0].nodeValue);
    }
});

由于您已经在使用 jQuery，您可以使用 jQuery 来遍历 XML：

var $xml = $(xmlDoc);
$xml.find("CompanyID").each(function() {
    alert( $(this).text() );
});

完整代码：

$.ajax({
    type: 'GET',
    url: 'Lookupbysurname.aspx?surname=beech',
    dataType: 'xml',
    success: function(xmlDoc) {
        var $xml = $(xmlDoc);
        $xml.find('CompanyID').each(function() {
            alert( $(this).text() );
        });
    }
});

Answer 2

但目前它只是一遍又一遍地提醒相同的响应。

当然可以，您每次都使用相同的索引 (0)。

但是 TL;DR 版本是：既然您已经在使用 jQuery，那么就使用 jQuery。您不仅可以使用它来替换复杂的解析器创建逻辑，而是使用 $.parseXML 代替，还可以使用 jQuery 来执行循环。在这里，我假设您正在尝试遍历 CompanyID 元素：

var xmlDoc = $.parseXML(data);
var $xml = $(xmlDoc);
$xml.find("CompanyID").each(function() {
    alert($(this).text());
});

Live example | source

---

为此，您的代码使用0 而不是i：

for (var i = 0; i < xmlDoc.getElementsByTagName("CompanyID")[0].childNodes[0].length; i++) {
    // This is always 0 -----------------------------------------v 
    alert(xmlDoc.getElementsByTagName("CompanyID")[0].childNodes[0].nodeValue);
}

如果您想遍历子节点，您想使用i，而不是0。

---

但该循环非常效率低下，因为您每次都要返回并重复查找。而是：

var nodes = xmlDoc.getElementsByTagName("CompanyID")[0].childNodes;
for (var i = 0; i < nodes.length; i++) {
    alert(nodes[i].nodeValue);
}

当然，也可以使用firstChild 和nextSibling：

var node;
for (node = xmlDoc.getElementsByTagName("CompanyID")[0].firstChild;
     node;
     node = node.nextSibling) {
    alert(node.nodeValue);
}

---

但是查看您的 XML，我怀疑您想循环遍历 CompanyID 节点，而不是它们的子节点：

var node;
for (node = xmlDoc.getElementsByTagName("CompanyID");
     node;
     node = node.nextSibling) {
    alert(node.firstChild.nodeValue);
}

---

但同样，您可以通过更多地使用您已经在使用的库来显着减少代码量。 :-)