爲什麼append只能運行我的代碼的最後一次迭代？

Question

我正在重新創建另一個表中的表格。我知道我在做什麼並不好，但不是我的決定。

我遍歷每個表並獲取創建新表所需的信息。這是爲新表創建標題的函數。

function setTableHeader(table, oldTableName, newTableName) { 
    table.html($('<thead />')); 

    var firstRow = $('<tr><th></th></tr>'); 
    var row = $('<tr></tr>'); 
    $('#'+oldTableName+' .budget-inner-table').each(function() { 
     var insideText = $(this).find('h3').eq(0).text(); 
     //console.log(insideText); 
     var column = $('<th></th>').text(insideText); 
     row.append(column); 
    }) 

    $('table#'+newTableName+' thead').append(firstRow).append(row); 

} 

這裏是我的新表的結果。我不明白爲什麼最後一張桌子上的標題是空的。

<section id="budget-overview-result"> 
    <table id="july-2014"> 
    <thead> 
     <tr><th></th></tr> 
     <tr> 
     <th>July 2014 - Media</th> 
     <th>July 2014 - Facebook</th> 
     <th>Budgetplanning Online Marketing</th> 
     </tr> 
    </thead> 
    </table> 

    <table id="august-2014"> 
    <thead></thead> 
    </table> 

Answer 1

附加應該發生在每個循環中:)

function setTableHeader(table, oldTableName, newTableName) { 
table.html($('<thead />')); 

var firstRow = $('<tr><th></th></tr>'); 
var row = $('<tr></tr>'); 
$('#'+oldTableName+' .budget-inner-table').each(function() { 
    var insideText = $(this).find('h3').eq(0).text(); 
    //console.log(insideText); 
    var column = $('<th></th>').text(insideText); 
    row.append(column); 
    $('table#'+newTableName+' thead').append(firstRow).append(row); 

}); 


} 

Answer 2

好吧，我發現我在做什麼錯。這不是循環中的追加。當我創建表格的時候，我需要在循環中調用表格。就像這樣：

所以不是

table.html($('<thead />')); 

是

$('table#'+newTableName).html($('<thead />'));