JQuery ajax加载XML，不在IE或Edge中工作

Question

这是我目前拥有的xml：

<?xml version="1.0" standalone="yes"?>
<lang>
    <item code="g">ICN<br />HKG</item>
</lang>

然后我使用以下代码提取XML内容：

$.get("file.xml",function(d){
   $("div").html($(d).find("item:first").html()); 
});

此代码适用于Chrome，但不适用于IE。我想知道为什么会这样。 当然，我可以将html()更改为text()，这可以在所有浏览器中使用，但会评估为ICNHKG，这不是我想要的。

任何想法是怎么回事？非常感谢。

Answer 1

关于$.get()

根据Jquery文档$.get()自动猜测内容类型，并根据数据类型进行某种形式的解析，在源代码中我们可以找到：

// Data converters
// Keys separate source (or catchall "*") and destination types with a single space
converters: {

    // Convert anything to text
    "* text": String,

    // Text to html (true = no transformation)
    "text html": true,

    // Evaluate text as a json expression
    "text json": jQuery.parseJSON,

    // Parse text as xml
    "text xml": jQuery.parseXML
},

关于$.parseXML()

根据Jquery文档，此函数使用浏览器本机XML解析器，对于IE，这是以与其他浏览器不同的方式调用，如Jquery源代码中所示，这意味着不仅IE使用其他浏览器XML解析器比所有其他浏览器，但也是这些之一，这就是为什么我们喜欢IE 的时刻：

if ( window.DOMParser ) { // Standard
    tmp = new window.DOMParser();
    xml = tmp.parseFromString( data, "text/xml" );
} else { // IE
    xml = new window.ActiveXObject( "Microsoft.XMLDOM" );
    xml.async = "false";
    xml.loadXML( data );
}

关于[object XMLDocument]和innerHTML

如果您尝试alert() XML解析文档，您将获得[object XMLDocument]作为回报。实际上什么是对象XMLDocument？这意味着这是一种与常规对象不同的对象（哇，没看到那个来了）。

在现代浏览器中，这种差异实际上（几乎）不存在。然而，在IE中，这意味着没有innerHTML这样的属性。唯一存在的是某种形式的nodeValue和常规.textContent，它们都会破坏html内容。然而，这并不意味着你的br标签完全不可能从XML中检索，它并不那么容易，因为它被解释为一个新的XML标签，正如你可以看到下面的代码：

$.get("/file.xml", function(d) {
    console.log(d.getElementsByTagName("item")[0].childNodes);
});

在IE中返回：

访问它并不容易;

$.get("file.xml", function(d) {
    console.log(d.getElementsByTagName("item")[0].childNodes[1].nodeValue); //returns null
    console.log(d.getElementsByTagName("item")[0].childNodes[1].nodeName); //returns br
});  

简而言之，IE XML解析器并不适合html内容。许多方法都不存在，这将导致重大问题。

那我该怎么办？

有不同的可能方法。第一个只是指定另一个数据类型并按此处理：

$.get("file.xml", function(d) {
    $("div").html($(d).find("item:first").html());
},"text"); //Datatype: text

另一种可能性是使用CDATA：

<强> XML

<?xml version="1.0" standalone="yes"?>
<lang>
    <item id="g"><![CDATA[HKG<br />ICN]]></item>
</lang>

<强>的Javascript（jQuery的）

$.get("file.xml", function(d) {
    $("div").html($(d).find("item:first").text());
});