如何在IE和Firefox中解析javascript中的XML？

Question

I'm trying to write a single piece of code to parse javascript in both IE and firefox.

The following works in IE, and functions without complaining in firefox

function XmlDom(sXml){
    var oXml;
    if (window.ActiveXObject) {
        // ie
        oXml = new ActiveXObject("Microsoft.XMLDOM");
        oXml.resolveExternals = false;
        oXml.async = false;
        oXml.loadXML(sXml);
    }
    else if (window.DOMParser){

        var parser = new DOMParser(); 
        oXml = parser.parseFromString(sXml, "text/xml");

    }
return oXml
}

The following works in IE, but gives errors (because childNodes doesn't exist) under Firefox

var oXml = XmlDom(sourceXML);
var listHtml = "";
if (oXml.firstChild != null) {
    var childNodes = null;
    try {
        childNodes = oXml.lastChild.lastChild.firstChild.childNodes;
    }
    if (childNodes != null && childNodes.length > 0) {

        for (var i = 0; i < childNodes.length; i++) {

            var vehicleName = NodeText(SelectSingleNode(childNodes[i], 'VehicleName', 'VehicleName'));
            var vehicleId = NodeText(SelectSingleNode(childNodes[i], 'VehicleId', 'VehicleId'));

        }
    }
}

Using jquery gives me correct behavior under firefox, but doesn't quite work in IE (it finds the correct number of vehicles, but each one has a null id and name)

 $(sourceXml).find("Table1").each(function() {
        var vehicleId = $(this).find("VehicleId").text();
        var vehicleName = $(this).find("VehicleName").text();
    });

I firmly believe that both these approaches should work. But something is going wrong. I'd love a hand.

<?xml version="1.0" encoding="utf-16"?>
<DataSet>
  <xs:schema id="NewDataSet" xmlns="" xmlns:xs="http://www.w3.org/2001/XMLSchema"     xmlns:msdata="urn:schemas-microsoft-com:xml-msdata" xmlns:msprop="urn:schemas-microsoft-com:xml-msprop">
    <xs:element name="NewDataSet" msdata:IsDataSet="true" msdata:UseCurrentLocale="true">
      <xs:complexType>
        <xs:choice minOccurs="0" maxOccurs="unbounded">
          <xs:element name="Table1">
            <xs:complexType>
              <xs:sequence>
                <xs:element name="VehicleId" msprop:metadatacolumnname="VehicleId" msprop:caption="VehicleId" type="xs:string" minOccurs="0" />
                <xs:element name="VehicleName" msprop:metadatacolumnname="VehicleName" msprop:caption="VehicleName" type="xs:string" minOccurs="0" />
            <xs:element name="SendAlarms" msprop:metadatacolumnname="SendAlarms" msprop:caption="SendAlarms" type="xs:string" minOccurs="0" />
          </xs:sequence>
        </xs:complexType>
      </xs:element>
    </xs:choice>
  </xs:complexType>
  </xs:element>
  </xs:schema>
  <diffgr:diffgram xmlns:msdata="urn:schemas-microsoft-com:xml-msdata"   xmlns:diffgr="urn:schemas-microsoft-com:xml-diffgram-v1">
<NewDataSet>
  <Table1 diffgr:id="Table11" msdata:rowOrder="0" diffgr:hasChanges="inserted">
    <VehicleId>8</VehicleId>
    <VehicleName>AIS Gate</VehicleName>
    <SendAlarms>False</SendAlarms>
  </Table1>
  <Table1 diffgr:id="Table12" msdata:rowOrder="1" diffgr:hasChanges="inserted">
    <VehicleId>82</VehicleId>
    <VehicleName>Amigos</VehicleName>
    <SendAlarms>False</SendAlarms>
  </Table1> 
</NewDataSet>
</diffgr:diffgram>
</DataSet>

Answer 1

The problem is that Firefox's XML parser is not ignoring whitespace text nodes whereas IE's is, meaning that oXml.lastChild.lastChild is in fact a text node and has no children. There's no way I know of to instruct DOMParser found in Firefox (and other browsers) to ignore whitespace nodes, so you'll have to work round it in one of two ways: either you remove whitespace before passing it to the parser's parseFromString() method, or you traverse the XML DOM in such a way that you filter out whitespace text nodes.

Firefox 3.5 and later supports the DOM Element Traversal API , meaning you can use properties like firstElementChild , lastElementChild , nextElementSibling and previousElementSibling . Firefox 3.5 also supports the children property of an element, which is the collection of all child nodes that are elements. Recent versions (I'm not sure of the specifics) of Safari, Chrome and Opera also support these properties.

One final option, which uses standard DOM Level 1 methods and will therefore work in all browsers, is to remove all whitespace nodes manually before traversing the DOM. The following function will do this recursively:

function removeWhiteSpaceNodes(node) {
    var child = node.firstChild, nextChild;
    while (child) {
        nextChild = child.nextSibling;
        if (child.nodeType == 3 && /^\s*$/.test(child.nodeValue)) {
            node.removeChild(child);
        } else if (child.hasChildNodes()) {
            removeWhiteSpaceNodes(child);
        }
        child = nextChild;
    }
}