用HTML读取XML

时间:2019-01-29 08:59:13

标签: javascript html xml

我很难解决这个问题...我正在为我自愿参加的广播电台的站点工作,我们想将正在播放的数据添加到该站点...播放数据通过FTP作为XML文件传递到站点主机。这是一个看起来像的例子。

max(my_list, key=lambda x:x.expectation).value

我需要html / js将<?xml version="1.0" encoding="UTF-8" standalone="no" ?> <PLAYBACKSTATE> <TRIGGER>PLAY</TRIGGER> <CURRENTTIME>01/29/19 01:17:05</CURRENTTIME> <PLAYLIST>012919</PLAYLIST> <ENV></ENV> <PLAY INDEX="0"> <CUTID>35189</CUTID> <TITLE>WARNED YOU</TITLE> <LENGTH> 131.20</LENGTH> <GROUP>2010_19</GROUP> <ARTIST>GOOD MORNING</ARTIST> <ALBUM>SHAWCROSS</ALBUM> </PLAY> <REMAINING>00:02:10</REMAINING> </PLAYBACKSTATE> 中的<Title>显示为<Artist>,但是我对任何编码都非常陌生,我不知道该怎么做...我所做的大部分事情都使用Adobe Muse,但是显然,这比muse先进一点。 xml文件将位于站点文件的根文件中。 预先感谢

1 个答案:

答案 0 :(得分:1)

您可以使用检索到的相同XML文件进行这样的解析。

运行代码段

var xmlFile = 'https://raw.githubusercontent.com/olayenca/externals/master/XMLArtist.xml';

function loadXML() {
  var xhttp = new XMLHttpRequest();

  xhttp.open("GET", xmlFile, true); //use your url/local filePath in place of "xmlFile"
  xhttp.send();
  xhttp.onreadystatechange = function() {
    if (this.readyState === 4 && this.status === 200) {
      parseXML(this.response);
    }
  };

}

function parseXML(xml) {
  var parser = new DOMParser();
  var xmlDoc = parser.parseFromString(xml, "text/xml");
  var table = "<tr><th>Title</th><th>Artist</th><th>Album</th></tr>";
  var x = xmlDoc.getElementsByTagName("PLAYBACKSTATE");
  for (var elem of x) {
    var titles = elem.getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;
    var arts = elem.getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue;
    var albums = elem.getElementsByTagName("ALBUM")[0].childNodes[0].nodeValue;

    table += "<tr><td>" + titles + "</td><td>" + arts + "</td><td>" + albums + "</td></tr>";
  }
  document.getElementById("tableID").innerHTML = table;
}
loadXML();
table,
th,
td {
  border: 1px solid black;
  border-collapse: collapse;
}

th,
td {
  padding: 5px;
}
<table id="tableID"></table>