我想以表格格式显示 XML 数据，下面是我编写的代码，但它不起作用。来自 XML 的数据被分支出来，因此没有完全出现在前面 - 但在我当前的代码中没有返回任何内容。
<!DOCTYPE html>
<html>
<style>
table,th,td {
border : 1px solid black;
border-collapse: collapse;
}
th,td {
padding: 5px;
}
th{
background-color:#BBB;
}
</style>
<body>
<p>Sample para component</p>
<button type="button" onclick="loadDoc()">Click me</button>
<br><br>
<table id="myTable"></table>
<script>
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
myFunction(xhttp);
}
};
xhttp.open("GET", "sample.xml", true);
xhttp.send();
}
function myFunction(xml) {
var a, b, c, d, e, f;
function smartValue1(root, tag) {
return (root.getElementsByTagName("InstructingOrgName").length &&
root.getElementsByTagName("InstructingOrgName")[0].childNodes.length &&
root.getElementsByTagName("InstructingOrgName")[0].childNodes[0].nodeValue
) || '';
}
function smartValue2(root, tag) {
return (root.getElementsByTagName("InstructingOrgCode").length &&
root.getElementsByTagName("InstructingOrgCode")[0].childNodes.length &&
root.getElementsByTagName("InstructingOrgCode")[0].childNodes[0].nodeValue
) || '';
}
function smartValue3(root, tag) {
for (c = 0; c <= document.getElementsByTagName("PortfolioName").length; c++) {
return (root.getElementsByTagName("PortfolioName").length &&
root.getElementsByTagName("PortfolioName")[c].childNodes.length &&
root.getElementsByTagName("PortfolioName")[c].childNodes[c].nodeValue
) || '';
}
}
function smartValue4(root, tag) {
for (d = 0; d <= document.getElementsByTagName("PortfolioCode").length; d++) {
return (root.getElementsByTagName("PortfolioCode").length &&
root.getElementsByTagName("PortfolioCode")[d].childNodes.length &&
root.getElementsByTagName("PortfolioCode")[d].childNodes[d].nodeValue
) || '';
}
}
function smartValue5(root, tag) {
for (e = 0; e <= document.getElementsByTagName("FundName").length; e++) {
return (root.getElementsByTagName("FundName").length &&
root.getElementsByTagName("FundName")[e].childNodes.length &&
root.getElementsByTagName("FundName")[e].childNodes[e].nodeValue
) || '';
}
}
function smartValue6(root, tag) {
for (f = 0; f <= document.getElementsByTagName("FundCode").length; f++) {
return (root.getElementsByTagName("FundCode").length &&
root.getElementsByTagName("FundCode")[f].childNodes.length &&
root.getElementsByTagName("FundCode")[f].childNodes[f].nodeValue
) || '';
}
}
var i;
var xmlDoc = xml.responseXML;
var xmlDoc1 = xml.responseXML;
var xmlDoc2 = xml.responseXML;
var table = "<tr><th>Instructing Org</th><th>Portfolio</th><th>Fund</th></tr>";
var x = xmlDoc.getElementsByTagName("ClientInvestmentInstruction");
var y = xmlDoc1.getElementsByTagName("Portfolio");
var z = xmlDoc2.getElementsByTagName("Fund");
for (i = 0; i < x.length; i++) {
table += "<tr><td>" +
smartValue1(x[i], "InstructingOrgName") +
" (" +
smartValue2(x[i], "InstructingOrgCode") +
") </td><td>" +
for (a = 0; a < y.length; y++) {
smartValue3(x[i], "PortfolioName") +
"  (" +
smartValue4(x[i], "PortfolioCode") +
") </td><td> " +
for (b = 0; b < z.length; z++) {
smartValue5(x[i], "FundName") +
" (" +
smartValue6(x[i], "FundCode") +
") </td></tr>"
}
}
}
document.getElementById("myTable").innerHTML = table;
}
</script>
</body>
</html>
<?xml version="1.0" encoding="UTF-8"?>
<ClientInvestmentInstructionList>
<ClientInvestmentInstruction>
<InstructingOrgName>Sample A</InstructingOrgName>
<InstructingOrgCode>Sample A code</InstructingOrgCode>
<PortfolioList>
<Portfolio>
<PortfolioName>Sample A Child</PortfolioName>
<PortfolioCode>Sample A Child code</PortfolioCode>
<AuthorizeFundList>
<Fund>
<FundName>Sample A Penultimate</FundName>
<FundCode>Sample A Penultimate code</FundCode>
</Fund>
<Fund>
<FundName>Sample A1 Penultimate</FundName>
<FundCode>Sample A1 Penultimate code</FundCode>
</Fund>
</AuthorizeFundList>
</Portfolio>
<Portfolio>
<PortfolioName>Sample B Child</PortfolioName>
<PortfolioCode>Sample B Child code</PortfolioCode>
<AuthorizeFundList>
<Fund>
<FundName>Sample B Penultimate</FundName>
<FundCode>Sample B Penultimate code</FundCode>
</Fund>
<Fund>
<FundName>Sample B1 Penultimate</FundName>
<FundCode>Sample B1 Penultimate code</FundCode>
</Fund>
<Fund>
<FundName>Sample B2 Penultimate</FundName>
<FundCode>Sample B2 Penultimate code</FundCode>
</Fund>
</AuthorizeFundList>
</Portfolio>
<Portfolio>
<PortfolioName>Sample C Child</PortfolioName>
<PortfolioCode>Sample C Child code</PortfolioCode>
</Portfolio>
</PortfolioList>
</ClientInvestmentInstruction>
<ClientInvestmentInstruction>
<InstructingOrgName>Sample part 2</InstructingOrgName>
<InstructingOrgCode>Sample part 2 code</InstructingOrgCode>
<PortfolioList>
<Portfolio>
<PortfolioName>Sample part 2 child</PortfolioName>
<PortfolioCode>Sample part 2 child code</PortfolioCode>
<AuthorizeFundList>
<Fund>
<FundName>Sample part 2 penultimate</FundName>
<FundCode>Sample part 2 penultimate code</FundCode>
</Fund>
<Fund>
<FundName>Sample part 2a penultimate</FundName>
<FundCode>Sample part 2a penultimate code</FundCode>
</Fund>
</AuthorizeFundList>
</Portfolio>
<Portfolio>
<PortfolioName>Sample part 3 child</PortfolioName>
<PortfolioCode>Sample part 3 child code</PortfolioCode>
<AuthorizeFundList>
<Fund>
<FundName>Sample part 3 penultimate</FundName>
<FundCode>Sample part 3 penultimate code</FundCode>
</Fund>
<Fund>
<FundName>Sample part 3a penultimate</FundName>
<FundCode>Sample part 3a penultimate code</FundCode>
</Fund>
</AuthorizeFundList>
</Portfolio>
</PortfolioList>
</ClientInvestmentInstruction>
</ClientInvestmentInstructionList>
最佳答案
您在 smartValueN 循环中超传递了一个 undefined index ，并且您试图在循环内返回值，除此之外，循环会因 return 而中断，而不是在 root 中通过标签名称获取元素，而是尝试在 document 中获取相同的元素。
smartValue3 的解决方案:
var result = "";
for (var i = 0, p; p = root.getElementsByTagName("PortfolioName")[i]; i++) {
result += (
p.childNodes.length && p.childNodes[i].nodeValue
) || '';
}
return result;
还有一个错字
for (b = 0; b < z.length; z++) {/*...*/}
for 语句不应出现在要递增值的表达式中，因此:
2 + for (b = 0; b < z.length; z++) {/*...*/}
导致此语法错误:
Uncaught SyntaxError: Unexpected token for
但它是固定的here !
关于javascript - 使用 AJAX 解析 XML 数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38941682/