Question

我正在尝试使用 xmlhttprequest 创建一个将xml节点拉入html的网站。

我想在表格中显示数据，问题在于在两个不同的节点之间进行选择。

在我的xml中，我有两个节点。 filmsincinemas 和 filmsfuturereleases ，它们都有4个子节点。我已经编写了javascript来读取xml文件并拉入电影节点及其子数据，但它会为每个电影节点提取数据。我希望能够分别引入 filmsincinemas 和 filmsfuturereleases 。

我的XML如下 - ＆gt;

<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
<xmlRoot>
    <filmplaylist>
        <filmsincinemas>
            <film>
                <name><![CDATA[Film 1]]></name>
                <website>http://www.movielink.com/</website>
                <video>trailer1.flv</video>
                <hd></hd>
            </film>
            <film>
                <name><![CDATA[Film 2]]></name>
                <website>http://www.movielink.com/</website>
                <video>trailer2.flv</video>
                <hd></hd>
            </film>
            <film>
                <name><![CDATA[Film 3]]></name>
                <website>http://www.movielink.com/</website>
                <video>trailer3.flv</video>
                <hd></hd>
            </film>
        </filmsincinemas>
        <filmsfuturereleases>
            <film>
                <name><![CDATA[Film 4]]></name>
                <website>http://www.movielink.com/</website>
                <video>trailer4.flv</video>
                <hd>trailer4hd.flv</hd>
            </film>
            <film>
                <name><![CDATA[Film 5]]></name>
                <website>http://www.movielink.com/</website>
                <video>trailer5.flv</video>
                <hd>trailer5hd.flv</hd>
            </film>
            <film>
                <name><![CDATA[Film 6]]></name>
                <website>http://www.movielink.com/</website>
                <video>trailer6.flv</video>
                <hd>trailer6hd.flv</hd>
            </film>
        </filmsfuturereleases>
    </filmplaylist>
</xmlRoot>

我的html / js如下 - ＆gt;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>XML test</title>

<!-- XML Connect -->
<script type="text/javascript">
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.open("GET","xml/main.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
</script>
<!-- XML Connect END -->

</head>

<body>

<div>
    <table cellspacing="0" cellpadding="0" border="1">

        <script>

        //Set X Var to parent node
        var x=xmlDoc.getElementsByTagName("film");

        //'For each' loop
        for (i=0;i<x.length;i++)
            {
            //Begin Table Row and TD
            document.write("<tr><td>");

            //If Node is empty
            if (x[i].getElementsByTagName("website")[0].childNodes.length == 0) {
                //Print space
                document.write("&nbsp;")
                } else {
                    //Print node
                    document.write(x[i].getElementsByTagName("website")[0].childNodes[0].nodeValue);
                }
            //Close row and TD
            document.write("</td><td>");

            //Same loop as previous
            if (x[i].getElementsByTagName("name")[0].childNodes.length) {
                document.write(x[i].getElementsByTagName("name")[0].childNodes[0].nodeValue);
                } else {
                    x = "none"
                }
            //Close TD and Row
            document.write("</td></tr>");
            }

        </script>

    </table>
</div>

</body>
</html>

提前致谢！

Answer 1

您的Javascript代码不是很好。但实现你想要的东西似乎很简单。这应该有用。

function getTable(xmlDoc){
    //Set X Var to parent node
    var x=xmlDoc.getElementsByTagName("film");
    //'For each' loop
    for (i=0;i<x.length;i++)
        {
        //Begin Table Row and TD
        document.write("<tr><td>");

        //If Node is empty
        if (x[i].getElementsByTagName("website")[0].childNodes.length == 0) {
            //Print space
            document.write("&nbsp;")
            } else {
                //Print node
                document.write(x[i].getElementsByTagName("website")[0].childNodes[0].nodeValue);
            }
        //Close row and TD
        document.write("</td><td>");

        //Same loop as previous
        if (x[i].getElementsByTagName("name")[0].childNodes.length) {
            document.write(x[i].getElementsByTagName("name")[0].childNodes[0].nodeValue);
            } else {
                x = "none"
            }
        //Close TD and Row
        document.write("</td></tr>");
        }
}

// Will print filmsfuturereleases
getTable(xmlDoc.getElementsByTagName("filmsfuturereleases")[0]);

// Will print filmsincinemas
getTable(xmlDoc.getElementsByTagName("filmsincinemas")[0]);

使用js来提取特定的xml数据

1 个答案: