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

Posted 2023-03-05

【中文标题】JQuery ajax 加载 XML，在 IE 或 Edge 中不起作用

【英文标题】：JQuery ajax to load XML, not working in IE or Edge

【发布时间】：2016-09-21 23:37:58

【问题描述】：

这是我目前拥有的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，这不是我想要的。

有什么想法吗？非常感谢您的帮助。

【问题讨论】：

你用的是哪个版本的IE？

Microsoft Edge，最新版本

【参考方案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-parser 比所有其他浏览器都要好，而且这是其中之一这就是我们喜欢 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());
);