Question

我尝试将API生成的XML文件与（当前）静态网页连接，该网页可以在oliverpwilson.github.io/tubular找到。我的HTML文件结构大致如下：

<div>
    <span id="content">No Content Yet</span>
</div>

以及<header>中的一些Javascript来确定<span>中的内容：

<script>
      function myFunction() {
      document.getElementById("content").innerHTML = "Some Content Now!";
</script>

和<body onload="myFunction">因此会在加载时触发。

这一切都有效。

我想要做的是使用由API生成的外部XML文件（准确地说是Transport for London API），在URI http://cloud.tfl.gov.uk/TrackerNet/LineStatus上托管，使用javascript解析信息，并使用它信息更新我的

document.getElementById("content").innerHTML = "Some Content Now!";

显示在引号内，即替换＆＃34;现在有些内容！＆＃34;使用存储在某个标记内的XML文件生成的任何内容，例如<Status Description="Good Service">，其中＆＃34; Some Content Now！＆＃34;将由＆＃34; Good Service＆＃34;。

取代

我希望广泛有意义。我不知道如何解决这个问题，所以任何帮助都会受到赞赏。

Answer 1

我查看了您网站上发布的内容。在那里你有这样的元素，这些元素具有以下结构：

div xxx-line
 |--- div details
       |--- div status
       |--- div details

通过这些，你可以选择在javascript中直接获得你想要的东西。你可以通过'status'或'details'中的id来调用它，或者你可以通过类'div xxx-line'来调用它，感觉自由。

您可以使用以下代码阅读xml：

if (window.DOMParser)
{
  parser=new DOMParser();
  xmlDoc=parser.parseFromString(txt,"text/xml");
}
else // Internet Explorer
{
  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
  xmlDoc.async=false;
  xmlDoc.loadXML(txt);
}

通过这种方式，您可以从节点获取信息：

//Get status
var status = xmlDoc.getElementsByTagName("status")[0].childNodes[0].nodeValue;

//Get details
var details = xmlDoc.getElementsByTagName("status")[0].childNodes[0].nodeValue;

使用变量状态或详细信息，您可以替换div的内容

使用JavaScript将HTML内容替换为外部XML文件中的内容？

1 个答案: