带有显示XML数据的HTML的空白页

Blank page with HTML displaying XML data

本文关键字：HTML 空白 数据 显示 XML      更新时间：2023-09-26

我有一个html文档，它用xml存档提供的数据创建了一个表。在adobe括号的实时预览中，我可以看到页面和数据。

但是，当我尝试在IE、Firefox或Chrome等浏览器中打开时，页面会显示为空白。

这里是html代码的一部分，下面是xml代码。

这是html代码

<!DOCTYPE html>
<html>
<head>
<style>
table { border-collapse: collapse; font-family: Futura, Arial, sans-serif; border: 1px solid #777; }
caption { font-size: larger; margin: 1em auto; }
th, td { padding: .65em; }
th, thead { background: #000; color: #fff; border: 1px solid #000; }
tr:nth-child(odd) { background: #ccc; }
tr:hover { background: #aaa; }
td { border-right: 1px solid #777; }
    </style>
</head>
<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","prueba_new.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML; 
document.write("<table><tr><th>CardN</th><th>CardC</th><th>CardE</th><th>CardNe</th></tr>");
var x=xmlDoc.getElementsByTagName("CCard");
for (i=0;i<x.length;i++)
  { 
  document.write("<tr><td>");
  document.write(x[i].getElementsByTagName("CardN")[0].childNodes[0].nodeValue);
  document.write("</td><td>");
  document.write(x[i].getElementsByTagName("CardC")[0].childNodes[0].nodeValue);
      document.write("</td><td>");
  document.write(x[i].getElementsByTagName("CardE")[0].childNodes[0].nodeValue);
      document.write("</td><td>");
  document.write(x[i].getElementsByTagName("CardNe")[0].childNodes[0].nodeValue);
  document.write("</td></tr>");
  }
document.write("</table>");
</script>
</body>
</html>

这是xml代码，当然，实际的xml文件，包含数百个条目。

<?xml version="1.0"?>
<numbers>
<CCard>
<CardNe>Volkervun</CardNe>
<CardN>10000034999</CardN>
<CardC>Red Team</CardC>
<CardE>Volker.vcd</CardE>
</CCard>
<CCard>
<CardNe>Lady Mars</CardNe>
<CardN>10009899899</CardN>
<CardC>Blue Team</CardC>
<CardE>LadyM.vcd</CardE>
</CCard>
</numbers>

我尝试了几种方法，但都不起作用。对那张空白页有什么想法吗？

如果您只需双击计算机上的.html文件就可以在浏览器中打开该文件，那么您是在file://协议下打开它的。XML文件的GET请求将失败，因为浏览器跨源沙盒：file://下的每个页面都被视为一个单独的域，因此您的.html页面不允许读取.XML文件。

它在Brackets中工作，因为Live Preview加载了一个简单的本地Web服务器，所以您的页面是在浏览器中根据http://协议查看的。要在没有Brackets的情况下复制效果，请运行不同的本地Web服务器。

我个人最喜欢的测试简单Web服务器是serf-如果你的计算机上安装了NodeJS，你可以通过在命令行上键入npm install -g serf来安装它。然后，只需在.html文件所在的任何文件夹中键入serf即可启动服务器。

相关文章：