1

已编辑

我需要用存储在外部 XML 文件中的内容填充网页。我找到了一个工作示例：http: //jsfiddle.net/9eqvq/

但是，在此示例中，数据直接写入 HTML 文档。

应用程序应该能够读取远程 XML 文件。我尝试使用 jQueryparseXML方法执行此操作，但无法访问 XML 文档。

当我尝试在控制台中输出 XML 文档的全部内容时，如下面的代码所示，我在 Chrome 的控制台中看到以下错误：

XMLHttpRequest cannot load file://localhost/Users/Fabi/Documents/xml/xml.xml. 
Cross origin requests are only supported for protocol schemes: 
http, data, chrome-extension, https, chrome-extension-resource.   VM71 jquery-1.10.1.js:8724
send                                                              VM71 jquery-1.10.1.js:8724
jQuery.extend.ajax                                                VM71 jquery-1.10.1.js:8154
(anonymous function)                                              VM72 index.html:19
fire                                                              VM71 jquery-1.10.1.js:3074
self.fireWith                                                     VM71 jquery-1.10.1.js:3186
jQuery.extend.ready                                               VM71 jquery-1.10.1.js:433
completed                                                         VM71 jquery-1.10.1.js:104

这是我正在使用的代码：

<html>
<head>
<title>Parsing XML File</title>
<script type="text/javascript" src="jquery-1.10.1.js"></script>  
</head>

<body>
    <div id="output">Default text without manpulation</div>

    <script>

        $(document).ready(function()
        {
          $.ajax({
            url: "xml/xml.xml",
            dataType: "xml",
            success: function(data)
            {
                console.log(data);
                $("#output").text("Message from Success function"); 
            }, 
            error:function()
            {
                $("#output").text("Message from Error function");   
            }
          });
        }); 

    </script>
</body>
</html>

当我打开index.html（通过双击）包含上面的脚本时，我看到了成功消息

Message from Success function

但不是 XML 文档的数据。当我$("#output").text("Message from Success function");用$("#output").text(data);Safari 替换时，Chrome 和 Firefox 只显示我

[object XMLDocument]

有人可以告诉我我做错了什么吗？是否有不需要本地网络服务器的工作演示文件？顺便说一句，我还尝试在 XAMPP 和 Node.js 网络服务器上使用 Safari、Chrome、Firefox 运行代码——但没有成功。任何帮助，将不胜感激。

4

1 回答 1

1

charlietfl 是对的：

如果成功处理程序正在工作，您正在接收数据

我尝试在 Chrome、Firefox 和 Safari 中启动相同的 HTML 文档。以前我主要依赖 Chrome。Chrome 没有显示使用 XML 数据生成的 HTML 文档。然而，Firefox 和 Safari 完成了这项工作。做了一些研究，我发现我必须以这种方式启动 Chrome：转到终端并使用 allow-file-access-from-files - 标志启动 Chrome，方法是输入：

Google\ Chrome.app --args --allow-file-access-from-files

对于那些有同样问题的人 - 这是一个演示。对我来说它的工作。将文件 index.html 和 cd_catalog.xml 保存在同一目录中，然后在浏览器中打开 index.html。我不记得我在哪里找到了这个例子，但我有足够的自由来修改它:-) 你最好不要在 Chrome 中这样做。首选 Firefox 或 Safari。

索引.html

<html>
<body>

<script>
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.open("GET","cd_catalog.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML; 

document.write("<table border='1'>");
var x=xmlDoc.getElementsByTagName("CD");
for (i=0;i<x.length;i++)
  { 
  document.write("<tr><td>");
  document.write(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
  document.write("</td><td>");
  document.write(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
  document.write("</td></tr>");
  }
document.write("</table>");
</script>

</body>
</html>

cd_catalog.xml

<?xml version="1.0" encoding="UTF-8"?>
<!-- Edited by XMLSpy -->
<CATALOG>

    <CD>
        <TITLE>Hide your heart</TITLE>
        <ARTIST>Bonnie Tyler</ARTIST>
        <COUNTRY>UK</COUNTRY>
        <COMPANY>CBS Records</COMPANY>
        <PRICE>9.90</PRICE>
        <YEAR>1988</YEAR>
    </CD>
    <CD>
        <TITLE>Greatest Hits</TITLE>
        <ARTIST>Dolly Parton</ARTIST>
        <COUNTRY>USA</COUNTRY>
        <COMPANY>RCA</COMPANY>
        <PRICE>9.90</PRICE>
        <YEAR>1982</YEAR>
    </CD>
    <CD>
        <TITLE>When a man loves a woman</TITLE>
        <ARTIST>Percy Sledge</ARTIST>
        <COUNTRY>USA</COUNTRY>
        <COMPANY>Atlantic</COMPANY>
        <PRICE>8.70</PRICE>
        <YEAR>1987</YEAR>
    </CD>
    <CD>
        <TITLE>Black angel</TITLE>
        <ARTIST>Savage Rose</ARTIST>
        <COUNTRY>EU</COUNTRY>
        <COMPANY>Mega</COMPANY>
        <PRICE>10.90</PRICE>
        <YEAR>1995</YEAR>
    </CD>

</CATALOG>
于 2014-11-16T09:45:39.293 回答