Question

我会保持这么短：我正在尝试通过一个库的xml文档循环。我有一个应该有效的脚本，但没有。谁能告诉我我哪里做错了？

我不想让这个问题变得更长，因为这个问题很简单，从昨天起就一直在思考这个问题，这是我最接近的问题。

我想循环遍历xml文件并首先打印出“path”和“file”。我正在构建一个库，并认为保存图像的所有数据的最佳方法是xml文件，但现在我无法正确循环。在脚本中我使页面打印出x和i，结果是x为1而i为0，因此在我看来它根本没有通过for循环。

任何帮助都会受到赞赏，因为我被困住了。一直在尝试这么多解决方案，我的头在旋转，如果没有朝着正确的方向轻推，我就无法进一步。

html / javascript：

        <script type="text/javascript">
            function displayResult()
            {
                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","../gallery/gallery.xml",false);
                xmlhttp.send();
                xmlDoc=xmlhttp.responseXML;


                x=xmlDoc.getElementsByTagName("session");
                for (i=0;i<x.length;i++)
                { 
                    img = "<img src='";
                    path = (x[0].getElementsByTagName("path")[0].childNodes[0].nodeValue);
                    file = (x[i].getElementsByTagName("file")[i].childNodes[0].nodeValue);
                    end = "' /><br />";
                    name = (x[i].getElementsByTagName("name")[i].childNodes[0].nodeValue);
                    txt = "x:" + x.length + "| i " + i + "<br />" + img + path + file + end + name + "<br />";
                    document.getElementById("content").innerHTML = txt;
                    //document.write(txt);
                }
            }
        </script>
    </head>
    <body onload="displayResult()">
        <div id='content'></div>
    </body>
</html>

XML的文件：

<gallery>
    <session>
        <path>../gallery/beauty/</path>
        <item>
            <file>_DSC2331.jpg</file>
            <name>Picture 1</name>
        </item>
        <item>
            <file>_DSC2339.jpg</file>
            <name>Picture 2</name>
        </item>
        <item>
            <file>_DSC2350.jpg</file>
            <name>Picture 3</name>
        </item>
        <date>2011-08-03</date>
    </session>
</gallery>

Answer 1

如果我可以提出一些建议：

在函数中使用var关键字使这些变量成为该函数的本地变量。您目前使用的代码将在全局命名空间中设置值，这通常被认为是不好的做法（例如，您可能会覆盖其他人的变量，或者其他人可能会覆盖您的变量）。还要在函数的开头声明变量，因为它们仍然是hoisted。
将代码拆分为更有意义的功能。通过这种方式，它们变得更容易阅读，并且通常会变得更加可重复使用。
确保循环浏览items以及sessions。
考虑使用像jQuery这样的Javascript框架。它们通常可以简化您必须编写的代码，并且您通常最终会自己编写更少的代码。

<html>
    <head>
        <script type="text/javascript">
            function loadDoc(url) {
                var xmlhttp = null;
                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", url, false);
                xmlhttp.send();
                return xmlhttp.responseXML;
            }

            function getContent(sessions) {
                var items = null,
                    i = 0,
                    j = 0,
                    img = "",
                    path = "",
                    file = "",
                    end = "",
                    name = "",
                    txt = "";
                for (i = 0; i < sessions.length; i++) { 
                    items = sessions[i].getElementsByTagName("item");
                    path = sessions[i].getElementsByTagName("path")[0].childNodes[0].nodeValue;
                    for (j = 0; j < items.length; j++) {
                        img = "<img src='";
                        file = items[j].getElementsByTagName("file")[0].childNodes[0].nodeValue;
                        end = "' /><br />";
                        name = items[j].getElementsByTagName("name")[0].childNodes[0].nodeValue;
                        txt += "session[" + i + "] item[" + j + "]<br />" + img + path + file + end + name + "<br />";
                    }
                }
                return txt;
            }

            function displayResult()
            {
                var xmlDoc = loadDoc("../gallery/gallery.xml");
                var sessions = xmlDoc.getElementsByTagName("session");
                var txt = getContent(sessions);
                document.getElementById("content").innerHTML = txt;
            }
        </script>
    </head>
    <body onload="displayResult()">
        <div id='content'></div>
    </body>
</html>

Answer 2

在我看来，你想要显示所有项目。

然而你循环'会话'，其中只有一个。

所以最多只能用这种方式获得1张照片..

您可能希望循环遍历xmlDoc.getElementsByTagName("item")并仍使用会话1来访问路径。

javascript xml阅读器

2 个答案: