使用for循环遍历xml

问题描述:

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

<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> 

+0

也请添加events.xml在这个问题 – 2012-03-20 03:50:38

+0

问题是每个标签的'id',在你的代码替换的第一组值,而每一次迭代循环。你选择id为'title'' date'的元素,因此它们在所有元素中都是相同的,它们必须是唯一的。 – iDroid 2012-03-20 04:50:12

我相信这应该是你的父节点事件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> 
+0

我确实有原始xml中的父节点,它只是没有正确复制。 – 2012-03-20 22:29:14

+0

你是否仍然使用jquery获得上述代码的问题? – 2012-03-21 06:26:58

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

解析XML使用Android中的XMLPullParser更加有效和简单使用。

How to use XMLPullParser