为什么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 />'));