解析xml并创建html表格纯javascript (使用数据块)
解析xml并创建html表格纯javascript (使用数据块)
提问于 2015-08-19 04:14:37
有人能找出我代码中的问题吗？我想把我的xml数据解析成一个html表，但它不工作。未创建任何表。
我的xml文件名为purchase
<?xml version="1.0">
<purchaseOrder xmlns="assoc">
<lineItem>
<name>Line Item 1</name>
<price>1.25</price>
</lineItem>
<lineItem>
<name>Line Item 2</name>
<price>2.48</price>
</lineItem>
</purchaseOrder>我的代码是：
<!DOCTYPE html>
<html>
<head>
<title>XML Data Block Demo</title>
<script>
function runDemo() {
var doc = document.getElementById("purchase-order").contentDocument;
var lineItems = doc.getElementsByTagNameNS("assoc", "lineItem");
var firstPrice = lineItems[0].getElementsByTagNameNS("assoc", "price")[0].textContent;
var HTML = "<table><tr><th>lineItems</th><th>firstprice</th></tr>";
var x=doc.getElementsByTagName("lineItem");
for(i=1;i<=;i++)
{
HTML += "<tr><td>"+x[i].getElementsByTagName("name")[0].childNodes[0].nodeValue+"</td><td>"+x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue+"</td></tr>";
}
HTML += "</table>";
document.getElementById("output").innerHTML = HTML;
}
</script>
</head>
<body onload="runDemo()";>
<object id="purchase-order" data="purchase.xml" type="text/xml" style="display: none;"></object>
<div id="output">My table did not run</div>
</body>
</html>我使用数据块对象方法将xml解析为html请参阅此处的链接，上面的方法用于获取xml数据data island alternative。
有人知道我的代码出了什么问题吗？
干杯
回答 2
Stack Overflow用户
发布于 2015-08-19 04:39:01
你的循环看起来很奇怪：
for(i=1;i<=;i++)为什么从1开始？而且没有限制。应该是这样的
for(i=0;i<=x.length;i++)此外，不使用firstPrice ...
Stack Overflow用户
发布于 2015-08-19 05:45:07
以下是您遇到的问题：
- xml声明应为：
<?xml version="1.0" ?>
- You应将对象标记的内联样式设置为：
style="visibility: hidden"
- Your代码必须在服务器上运行，以避免跨域策略。为此，您可以使用"http- server“或您选择的服务器。
- "runDemo”函数的工作版本应如下所示：
function runDemo() {
var doc = document.getElementById("purchase-order").contentDocument;
var lineItems = doc.getElementsByTagName("lineItem");
var html = "<table><tr><th>lineItems</th><th>firstprice</th></tr>";
for (i = 0; i < lineItems.length; i++) {
html += "<tr><td>"
+ lineItems[i].getElementsByTagName("name")[0].childNodes[0].nodeValue
+ "</td><td>"
+ lineItems[i].getElementsByTagName("price")[0].childNodes[0].nodeValue
+ "</td></tr>";
}
html += "</table>";
document.getElementById("output").innerHTML = html;
}
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/32081806
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号