时间戳

首页 > 解决方案 > 如何从 XML 表格单元格中获取 url/href

javascript - 如何从 XML 表格单元格中获取 url/href

问题描述

我在从 XML 单元格获取 url/href 时遇到困难。

在下面的示例中，我能够获取type和subtype的值，但我不知道如何从photo获取url。

我的想法是它可以类似于“var x = elem.getElementsByTagName("photo").url;" 但似乎我无法弄清楚。

XML:

<item>
    <type>animal</type>
    <subtype>dog</contentId>
    <photo url="https://cdn.pixabay.com/photo/2016/02/19/15/46/dog-1210559_1280.jpg"/>
</item>

<item>
    <type>animal</type>
    <subtype>cat</contentId>
    <photo url="https://cdn.pixabay.com/photo/2017/02/20/18/03/cat-2083492_960_720.jpg"/>
</item>

代码：

<style>
table,
th,
td {
  border: 1px solid black;
  border-collapse: collapse;
}
th,
td {
  padding: 5px;
}
</style>


<button type="button" onclick="loadDoc()">Load</button>
<br><br>
<table id="myTable"></table>


<script>
var xmlFile = 'file.xml';

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

  xhttp.open("GET", xmlFile, true);
  xhttp.send();
  xhttp.onreadystatechange = function() {
    if (this.readyState === 4 && this.status === 200) {
      xmlFunction(this.response);
    }
  };

}

function xmlFunction(xml) {
  var parser = new DOMParser();
  var xmlDoc = parser.parseFromString(xml, "text/xml");
  var table = "<tr><th>Type</th><th>Subtype</th><th>Photo</th></tr>";
  var x = xmlDoc.getElementsByTagName("item");
  for (var elem of x) {
    var type = elem.getElementsByTagName(
  "type")[0].childNodes[0].nodeValue;
    var subtype = elem.getElementsByTagName("subtype")[0].childNodes[0].nodeValue;
    var photo = elem.getElementsByTagName("photo").url;

    table += "<tr><td>" + type + "</td><td>" + subtype + "</td><td>" + photo + "</td></tr>";
  }
  document.getElementById("myTable").innerHTML = table;
}
</script>

标签： javascripthtmlhtml-tablexmlhttprequest

解决方案

在您的代码中，您有这一行：

var photo = elem.getElementsByTagName("photo").url;

您需要元素的属性。由于您使用 0 作为索引，因此您也可以将其用于照片，并且可以将该行代码更新为：

var photo = elem.getElementsByTagName("photo")[0].getAttribute('url');

请注意，在您提供的 xml 中，此行不正确：

<subtype>dog</contentId>

您还缺少一个根节点，但我认为这是 xml 可能是更大部分的一部分。

推荐阅读