使用 JS 将 XML 数据输出到 HTML

Outputting XML data to HTML by use of JS

本文关键字:输出 HTML 数据 XML JS 使用      更新时间:2023-09-26

问题:

尝试从 XML 文件中一次打印一个问题和 4 个答案。

JS代码:

var xmlDoc, quest, ans, i, n;
xmlDoc = loadXMLDoc("questions.xml");
quest = xmlDoc.getElementsByTagName('main');
document.write("<table border='1'>");
for (i = 0; i < quest.length; i+=1)
{
    document.write("<tr><td>");
    document.write( quest[i].childNodes[0].nodeValue );
    document.write("</td></tr>");
    for(n = 0; n < 4; n++) 
    {
        document.write("<tr><td>");
        document.write( quest[i].childNodes[n].nodeValue );
        document.write("</td></tr>");
    }
}
document.write("</table>");

期望输出:

每个问题下面都有四个答案。现在只有问题被正确打印。

XML 文件的结构为:

<main>
    <instruction></instruction>
    <solution></solution>
    <solution></solution>
    <solution></solution>
    <solution></solution>
</main>

它应该是这样的:

var xmlDoc, quest, ans, i, n;
xmlDoc = loadXMLDoc("questions.xml");
quest = xmlDoc.getElementsByTagName('main');
document.write("<table border='1'>");
for (i = 0; i < quest.length; i+=1)
{
    document.write("<tr><td>");
    document.write( quest[i].childNodes[0].nodeValue );
    document.write("</td></tr>");
    for(n = 1; n < 5; n++) // m = 1 because [0] is the title.
    {
        document.write("<tr><td>");
        document.write( quest[i].childNodes[n].nodeValue );
        document.write("</td></tr>");
    }
}
document.write("</table>");