如何使用 Javascript 加载 XML 文件内容？答案

【问题标题】：How to Load XML File Contents using Javascript?如何使用 Javascript 加载 XML 文件内容？
【发布时间】：2010-10-24 19:34:17
【问题描述】：

我正在寻找一种将 XML 文件的内容直接加载到 Javascript 变量中的方法。假设我有以下目录结构：

/index.html
/loader.js
/file.xml

在index.html中，有一个<body>标签，其内容应替换为XML文件的内容。所以如果 XML 文件包含：

<element>
    <item>Item One</item>
    <item>Item Two</item>
</element>

然后在动态加载之后，HTML 将是：

...
<body>
<element>
...
</element>
</body>
...

我的问题是，我可以在loader.js 中使用什么函数将内容直接加载到变量中？我使用了 XmlHttpRequests 和 ActiveX XMLDOM 解析器，但它们都只是给了我一个结构化数据模型，然后我必须对其进行排序以找到我的元素。我不需要解析任何东西，我只想获取所有文件内容。

注意：仅限 HTML/Javascript，无服务器端代码。

【问题讨论】：

这对于普通的 JavaScript 来说可能很麻烦，你在使用任何框架吗？（在有人说“使用 jQuery”之前...）

标签： javascript html xml xmlhttprequest

【解决方案1】：

我想我可能已经明白了。以下似乎工作得很好：

function loadFileToElement(filename, elementId)
{
    var xmlHTTP = new XMLHttpRequest();
    try
    {
    xmlHTTP.open("GET", filename, false);
    xmlHTTP.send(null);
    }
    catch (e) {
        window.alert("Unable to load the requested file.");
        return;
    }

    document.getElementById(elementId).innerHTML=xmlHTTP.responseText;
}

【讨论】：

您可能需要考虑异步运行它。同步 AJAX 请求会锁定浏览器的 UI，让用户觉得他们的浏览器已挂起。
这将在客户端运行，而不是在服务器上，所以我们不太担心性能。双击桌面上的 HTML 文件的图片。
执行此操作时出现 CORS 异常

【解决方案2】：

也许您可以在解析之前读取 XmlHttpRequests 的 responseText 属性以获取纯文本？

【讨论】：