jQuery：用不一致的行數據解析XML到表

這可能是一個很菜鳥的問題，但我很難過。jQuery：用不一致的行數據解析XML到表

我有以下代碼解析XML文件並將每個元素放入表中。我的問題是，每行中並不總是有九個元素，每個元素的名稱在XML文件之間會發生變化。有什麼辦法可以創建一個遍歷每一行的循環（不知道元素名稱（col0,col1等））並將其放入表中？

的XML是這樣的：

<row> 
    <Col0>titles</Col0> 
    <Col1>more titles</Col1> 
    <Col2>title</Col2> 
    <Col3>name</Col3> 
    <Col4>another name</Col4> 
    <Col5>different name</Col5> 
    <Col6></Col6> 
    <Col7></Col7> 
    <Col8></Col8> 
</row> 
<row> 
    <Col0>5:58</Col0> 
    <Col1>-</Col1> 
    <Col2>6:08</Col2> 
    <Col3>6:11</Col3> 
    <Col4>6:15</Col4> 
    <Col5>6:19</Col5> 
    <Col6></Col6> 
    <Col7></Col7> 
    <Col8></Col8> 
</row>

等....

這裏是我的代碼：

<script type="text/javascript"> 
    $(document).ready(function() 
    { 
    $.get('newlayout.xml', function(d){ 
    $('.tabl').append('<table>'); 

    $(d).find('row').each(function(){ 

     var $row = $(this); 

     var col01 = $row.find('Col0').text(); 
     var col02 = $row.find('Col1').text(); 
     var col03 = $row.find('Col2').text(); 
     var col04 = $row.find('Col3').text(); 
     var col05 = $row.find('Col4').text(); 
     var col06 = $row.find('Col5').text(); 
     var col07 = $row.find('Col6').text(); 
     var col08 = $row.find('Col7').text(); 
     var col09 = $row.find('Col8').text(); 


     html = '<tr>' 
     html += '<td style="width:80px"> ' + col01 + '</td>'; 
     html += '<td style="width:80px"> ' + col02 + '</td>' ; 
     html += '<td style="width:80px"> ' + col03 + '</td>' ; 
     html += '<td style="width:80px"> ' + col04 + '</td>' ; 
     html += '<td style="width:80px"> ' + col05 + '</td>' ; 
     html += '<td style="width:80px"> ' + col06 + '</td>' ; 
     html += '<td style="width:80px"> ' + col07 + '</td>' ; 
     html += '<td style="width:80px"> ' + col08 + '</td>' ; 
     html += '<td style="width:80px"> ' + col09 + '</td>' ; 
        html += '</tr>'; 

     $('.tabl').append($(html)); 

    }); 
}); 
});

由於提前，
湯姆

來源

2011-05-01 tim c

@您可以定義細化代碼，所有這些行可以細化爲2或3行。 – kobe 2011-05-01 06:25:00

嘗試以下操作：

$('row').each(function(){ 
    var $row = $(this); 
    $('.tabl').append($('<tr></tr>').append($row.children().wrapInner('<td style="width:80px"></td>').find('td'))); 
})

Working example at jsFiddle.

我覺得你可以按照這裏發生了什麼。如果沒有，請離開。這主要是理解不同的jQuery功能的問題，因爲這個沒有什麼比api.jquery.com

編輯： This version擺脫了空單元格中，只選擇那些東西（即不空）母細胞：

$('row').each(function(){ 
    var $row = $(this); 
    $('.tabl').append($('<tr></tr>').append($row.children().wrapInner('<td style="width:80px"></td>').find('td:parent'))); 
})

來源

2011-05-01 06:50:09 ampersand

[此版本]（http://jsfiddle.net/Eyd67/1/）概述表單元格以證明空單元格仍在創建中：http://jsfiddle.net/Eyd67/1/ – ampersand 2011-05-01 06:55:38

jsFiddle - 什麼一個很酷的工具！ – scaganoff 2011-05-01 07:02:25

擺脫空單元格的版本存在一個問題：如果在一行中間存在空單元格，它將破壞列排序。請參閱：http://jsfiddle.net/entropo/mJdgq/2/只要標題行格式正確，我答案中的解決方案就可以避免這種情況。 – entropo 2011-05-02 06:47:32

$(d).find('row').each(function() { 
    var $row = $(this); 
    html = '<tr>'; 
    var i = 0; 

    while (true) { 
     if ($.trim((colX = $row.find('Col' + i).text())) !== '') { 
      html += '<td style="width:80px"> ' + colX + '</td>'; 
      i++; 
     } 
     else { 
      break; 
     } 
    } 

    html += '</tr>'; 
    $('.tabl').append($(html)); 
});

來源

2011-05-01 06:42:59 Mike

如果你想只對字段列，與第一行中的名稱，那麼這會爲你工作：

http://jsfiddle.net/entropo/ffyDT/

$('row').each(function() { 
    var $row = $(this), 
     fieldcount = fieldcount || 0, 
     afterfirst; 
    if (! afterfirst) { 
     fieldcount = $row.find(':not(:empty)').length; 
     afterfirst = 1; 
    } 

    $('.tabl').append($('<tr />').append($row.children(':lt('+fieldcount+')') 
     .wrapInner('<td />').find('td'))); 
});

來源

2011-05-01 07:38:22 entropo

jQuery：用不一致的行數據解析XML到表

回答

相關問題