Jquery-将带有重复条目的xml解析为单独的列

时间:2015-06-11 22:44:09

标签: javascript jquery html xml

我有一个具有以下结构的XML文件(此结构重复):

<File>
  <scanRange>0,887</scanRange>
  <name>HARMONY   __050.DZT</name>
  <Profile>
    <scanRange>0,887</scanRange>
    <Comment>
      <scan>0</scan>
      <description>Data Collection Notes: </description>
    </Comment>
    <WayPt>
      <scan>0</scan>
      <mark>User</mark>
      <name>Mark2</name>
      <distance>0.0000000</distance>
      <localCoords>0.0000000,0.5000000,0.0000000</localCoords>
    </WayPt>
    <WayPt>
      <scan>887</scan>
      <distance>18.000000</distance>
      <localCoords>18.000000,0.5000000,0.0000000</localCoords>
    </WayPt>
  </Profile>
</File>

我需要得到的是文件名,距离和localCoords到表中。但我现在所拥有的将重复的条目组合在一起。

$(document).ready(function() {

    $("#XML").append('<table><tr><th>File</th><th>Distance</th>  <th>LocalCoords</th>');
    $.ajax({
        type: "GET",
        url: "HARMONY01.DZX",
        dataType: "xml",
        success: function(xmlData) {
            $("File", xmlData).each(function() {
                var name = $(this).find("name").text(),
                    distance = $(this).find("distance").text(),
                    localCoords = $(this).find("localCoords").text();

                $("#XML").append('<tr>');
                $("#XML").append('<td class="name">' + name + '</td>');
                $("#XML").append('<td class="Distance">' + distance + '</td>');
                $("#XML").append('<td class="localCoords">' + localCoords + '</td>');
                $("#XML").append('</tr>');
            });
        }
    });
    $("#XML").append('</table>');
});

我也试过这个:

var name1 = $(this).find("name").text(),
    name2 = $(this).find("name").text(),
  distance1 = $(this).find("distance").text(),
  distance2 = $(this).find("distance").text(),
  localCoords1 = $(this).find("localCoords").text();
  localCoords2 = $(this).find("localCoords").text();

  $("#XML").append('<tr>');       
  $("#XML").append('<td class="name">'+name1+'</td>');
  $("#XML").append('<td class="Distance">'+distance1+'</td>');
  $("#XML").append('<td class="localCoords">'+localCoords1+'</td>');
  $("#XML").append('<td class="Distance">'+distance2+'</td>');
  $("#XML").append('<td class="localCoords">'+localCoords2+'</td>');
  $("#XML").append('</tr>');

但它只是重复同样的事情。

什么会更好,将localCoords字段分为三个子列的值。

有人可以帮忙解决这个问题吗?非常感谢。

2 个答案:

答案 0 :(得分:1)

您需要循环遍历XML中的重复元素,在本例中为“WayPt”而非“文件”。

    $(document).ready(function() {

    $("#XML").append('<table><tr><th>File</th><th>Distance</th>  <th>LocalCoords</th>');
    $.ajax({
        type: "GET",
        url: "HARMONY01.DZX",
        dataType: "xml",
        success: function(xmlData) {
            var name = $(xmlData).find("File").find("name").text();
            $("WayPt", xmlData).each(function() {
                var distance = $(this).find("distance").text(),
                    localCoords = $(this).find("localCoords").text();

                $("#XML").append('<tr>');
                $("#XML").append('<td class="name">' + name + '</td>');
                $("#XML").append('<td class="Distance">' + distance + '</td>');
                $("#XML").append('<td class="localCoords">' + localCoords + '</td>');
                $("#XML").append('</tr>');   console.log("jhk");
            });
        }
    });
    $("#XML").append('</table>');
});

答案 1 :(得分:0)

只是为了澄清上面的答案,因为有一些疏忽。 '文件'重复多次,因此需要有'每个'以及'WayPt':

$(document).ready(function(){
  var idx=0;
  var distance =[], localCoords=[];

  $("#XML").append('<table><tbody><tr><th>File</th><th>Distance</th><th>LocalCoords</th><th>Distance</th><th>LocalCoords</th>');   
  $.ajax({
   type: "GET",
   url: "HARMONY01.DZX",
   dataType: "xml",
   success: function(xmlData) {
     $("File", xmlData).each(function(){
     var name = $(this).find("name").text();
         $("WayPt", xmlData).each(function(){
           distance[idx] = $(this).find("distance").text();
           localCoords[idx] = $(this).find("localCoords").text();
           idx=1;
         });

      $("#XML").append('<tr>');       
      $("#XML").append('<td class="name">'+name+'</td>');
      $("#XML").append('<td class="Distance">'+distance[0]+'</td>');
      $("#XML").append('<td class="localCoords">'+localCoords[0]+'</td>');
      $("#XML").append('<td class="Distance">'+distance[1]+'</td>');
      $("#XML").append('<td class="localCoords">'+localCoords[1]+'</td>');
      $("#XML").append('</tr>');
      idx=0;
      });
    }
  });
  $("#XML").append('</tobdy></table>'); 
});