使用for循环遍历xml

时间:2012-03-20 03:45:04

标签: javascript xml parsing for-loop xml-parsing

我正在尝试使用for循环来遍历XML文档并将数据放在网页中。我想要这个代码做的是获取XML中的前4个条目并显示它们的标题,日期,时间和描述。我目前的代码看起来像这样。

<script type="text/javascript">
        xmlhttp=new XMLHttpRequest();
        xmlhttp.open("GET","events.xml",false);
        xmlhttp.send();
        xmlDoc=xmlhttp.responseXML;
        var i = 0;
        for( i = 0; i <4; i++){

        document.write("<div style=\"display:block;padding-left:5px;\">");
        document.write("<br/>");
        document.write("<strong>What:</strong> <span id=\"title\">  </span>");
        document.write("<br/>");
        document.write("<strong>When:</strong> <span id=\"date\"></span> @ <span id=\"time\"></span>");
        document.write("<br/>");
        document.write("<strong>Description:</strong> <span id=\"descr\"></span><br/></div>");

        document.getElementById("title").innerHTML = xmlDoc.getElementsByTagName("title")[i].childNodes[0].nodeValue;
        document.getElementById("date").innerHTML = xmlDoc.getElementsByTagName("date")[i].childNodes[0].nodeValue;
        document.getElementById("time").innerHTML =xmlDoc.getElementsByTagName("time")[i].childNodes[0].nodeValue;
        document.getElementById("descr").innerHTML =xmlDoc.getElementsByTagName("descr")[i].childNodes[0].nodeValue;}


    </script>

不正确的输出看起来像这样。

What: Relay for Life Bingo
When: N/A @ N/A
Description: N/A

What: 
When: @ 
Description: 

What: 
When: @ 
Description: 

What: 
When: @ 
Description: 

第一个条目不正确,因为它是XML文件中的第四个元素,您可以看到其余条目为空白。我是XML的新手,所以这可能是一些初学者的错误,但我希望得到一些关于如何使其工作的反馈。

events.xml

<event>
    <title>Relay for Life Wristband Sale</title>
    <date>March 26 &amp; 28 </date>
    <time>11 A.M - 3 P.M.</time>
    <descr>N/A</descr>
</event>

<event>
    <title>SHPE/SWE/EC/IEEE Dodgeball Event</title>
    <date>April 1 </date>
    <time>N/A</time>
    <descr>N/A</descr>
</event>

<event>
    <title>CH2MHILL Social/GBM</title>
    <date>April 2</date>
    <time>N/A</time>
    <descr>N/A</descr>
</event>

<event>
    <title>Relay for Life Bingo</title>
    <date>N/A</date>
    <time>N/A</time>
    <descr>N/A</descr>
</event>

<event>
    <title></title>
    <date></date>
    <time></time>
    <descr></descr>
</event>

<event>
    <title></title>
    <date></date>
    <time></time>
    <descr></descr>
</event>

<event>
    <title></title>
    <date></date>
    <time></time>
    <descr></descr>
</event>

2 个答案:

答案 0 :(得分:1)

我相信这应该是带有父节点事件的events.xml。

<?xml version="1.0" encoding="utf-8" standalone="no"?>
<events>
<event>
<title>Relay for Life Wristband Sale</title>
<date>March 26 &amp; 28 </date>
<time>11 A.M - 3 P.M.</time>
<descr>N/A</descr>
</event>
<event>
<title>SHPE/SWE/EC/IEEE Dodgeball Event</title>
<date>April 1 </date>
<time>N/A</time>
<descr>N/A</descr>
</event>
<event>
<title>CH2MHILL Social/GBM</title>
<date>April 2</date>
<time>N/A</time>
<descr>N/A</descr>
</event>
<event>
<title>Relay for Life Bingo</title>
<date>N/A</date>
<time>N/A</time>
<descr>N/A</descr>
</event>
<event>
<title></title>
<date></date>
<time></time>
<descr></descr>
</event>
<event>
<title></title>
<date></date>
<time></time>
<descr></descr>
</event>
<event>
<title></title>
<date></date>
<time></time>
<descr></descr>
</event>
</events>

Use Jquery, see the below code with your XML. It will easy for you.

<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</head>
<body>
<script>
$.get('events.xml', function(d){

$(d).find('event').each(function(){
    var $entry = $(this);
    var title = $entry.find('title').text();
    alert(title);
})
}); 
</script>
</body>
</html>

答案 1 :(得分:0)

签入 events.xml ,您指定了标题,例如标题,日期..

要解析XML,请在Android中使用 XMLPullParser ,这样更有效,更易于使用。

How to use XMLPullParser