用ajax加载xml内容
[英]Loading xml content with ajax
问题描述
Ok so i have the following html file: 
好的，所以我有以下html文件：
<!DOCTYPE html>
<html>
<style>
table,
th,
td {
border: 1px solid black;
border-collapse: collapse;
}
th,
td {
padding: 5px;
}
</style>
<body>
<button type="button" onclick="loadDoc()">Get the names</button>
<br>
<br>
<table id="demo"></table>
<script>
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
myFunction(xhttp);
}
};
xhttp.open("GET", "names.xml", true);
xhttp.send();
}
function myFunction(xml) {
var i;
var xmlDoc = xml.responseXML;
var table = "<tr><th>Names</th></tr>";
var x = xmlDoc.getElementsByTagName("Names");
for (i = 0; i < x.length; i++) {
table += "<tr><td>" +
x[i].getElementsByTagName("Name")[0].childNodes[0].nodeValue;
}
document.getElementById("demo").innerHTML = table;
}
</script>
</body>
</html>
And the following xml file containing names: 以及以下包含名称的xml文件：
<?xml version="1.0" encoding="UTF-8" ?>
<Names>
<Name>Alex</Name>
<Name>Anna</Name>
<Name>Eva</Name>
<Name>George</Name>
<Name>Jason</Name>
<Name>John</Name>
<Name>Lisa</Name>
<Name>Mary</Name>
<Name>Michael</Name>
<Name>Nick</Name>
<Name>Vicky</Name>
</Names>
And what i want is to somehow take the names from the xml file and store them inside an array and then print them.But for some reason only the first name is stored correctly("Alex").I dont understand what i have done wrong.Can somebody help me? 我想要的是以某种方式从xml文件中获取名称，并将其存储在数组中，然后打印它们。但是由于某些原因，只有正确存储了名字（“ Alex”）。我不知道我做错了什么有人可以帮我吗？ I bet there is something wrong with the myFunction(xml) but i cant find/fix it 我敢打赌myFunction(xml)出了点问题，但我找不到/修复它
2 个解决方案
解决方案1
2 2016-05-22 18:57:10
There is only one Names tag so your loop will only execute once. 只有一个Names标签，因此您的循环将只执行一次。
I would loop over the Name tags instead. 我会遍历Name标签。
function myFunction(xml) {
var i;
var xmlDoc = xml.responseXML;
var table = "<tr><th>Names</th></tr>";
var x = xmlDoc.getElementsByTagName("Name");
for (i = 0; i < x.length; i++) {
table += "<tr><td>" +
x[i].childNodes[0].nodeValue;
}
document.getElementById("demo").innerHTML = table;
}
解决方案2
1 已采纳 2016-05-22 18:57:12
You need to check this: 您需要检查以下内容：
var x = xmlDoc.getElementsByTagName("Names"); // Get the Names node.
var data = x[0].getElementsByTagName("Name"); // Get the Name node.
(function() { function myFunction(xml) { var i; var xmlDoc = (new window.DOMParser()).parseFromString(xml, "text/xml"); var table = "<tr><th>Names</th></tr>"; var x = xmlDoc.getElementsByTagName("Names"); var data = x[0].getElementsByTagName("Name"); for (i = 0; i < data.length; i++) { table += "<tr><td>" + data[i].childNodes[0].nodeValue + "</td></tr>"; } document.getElementById("demo").innerHTML = table; } var xml = "<?xml version=\\"1.0\\" encoding=\\"UTF-8\\" ?><Names> <Name>Alex</Name> <Name>Anna</Name> <Name>Eva</Name> <Name>George</Name> <Name>Jason</Name> <Name>John</Name> <Name>Lisa</Name> <Name>Mary</Name> <Name>Michael</Name> <Name>Nick</Name> <Name>Vicky</Name></Names>"; myFunction(xml); })();
<table id="demo"></table>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.