尼尔的回答是迄今为止最好的。然而，事情很快就会变得一团糟。我的建议是使用变量来存储元素并将其附加到DOM层次结构中。

HTML

<table id="tableID">
    <tbody>
    </tbody>
</table>

JAVASCRIPT语言

// Reference to the table body
var body = $("#tableID").find('tbody');

// Create a new row element
var row = $('<tr>');

// Create a new column element
var column = $('<td>');

// Create a new image element
var image = $('<img>');
image.attr('src', 'img.png');
image.text('Image cell');

// Append the image to the column element
column.append(image);
// Append the column to the row element
row.append(column);
// Append the row to the table body
body.append(row);

<table id=myTable>
    <tr><td></td></tr>
    <style="height=0px;" tfoot></tfoot>
</table>

您可以缓存页脚变量并减少对DOM的访问（注意：使用假行而不是页脚可能会更好）。

var footer = $("#mytable tfoot")
footer.before("<tr><td></td></tr>")

提示：通过innerHTML或.html（）在html表中插入行在某些浏览器中是无效的（类似于IE9），在任何浏览器中使用.append（“<tr></tr>”）都不是很好的建议。最好和最快的方法是使用纯javascript代码。

要以这种方式与jQuery结合，只需添加类似于jQuery的新插件：

$.fn.addRow=function(index/*-1: add to end  or  any desired index*/, cellsCount/*optional*/){
    if(this[0].tagName.toLowerCase()!="table") return null;
    var i=0, c, r = this[0].insertRow((index<0||index>this[0].rows.length)?this[0].rows.length:index);
    for(;i<cellsCount||0;i++) c = r.insertCell(); //you can use c for set its content or etc
    return $(r);
};

现在在整个项目中使用它，类似于：

var addedRow = $("#myTable").addRow(-1/*add to end*/, 2);

如果你有一个<tbody>和一个<tfoot>呢？

例如：

<table>
    <tbody>
        <tr><td>Foo</td></tr>
    </tbody>
    <tfoot>
        <tr><td>footer information</td></tr>
    </tfoot>
</table>

然后它将在页脚中插入新行，而不是插入正文。

因此，最好的解决方案是包含<tbody>标记并使用.append，而不是.after。

$("#myTable > tbody").append("<tr><td>row content</td></tr>");

我建议

$('#myTable > tbody:first').append('<tr>...</tr><tr>...</tr>'); 

与

$('#myTable > tbody:last').append('<tr>...</tr><tr>...</tr>'); 

第一个和最后一个关键字作用于要启动的第一个或最后一个标记，而不是关闭。因此，如果您不希望更改嵌套表，而是将其添加到整个表中，则这在嵌套表中的效果更好。至少，这是我发现的。

<table id=myTable>
  <tbody id=first>
    <tr><td>
      <table id=myNestedTable>
        <tbody id=last>
        </tbody>
      </table>
    </td></tr>
  </tbody>
</table>

我的解决方案：

//Adds a new table row
$.fn.addNewRow = function (rowId) {
    $(this).find('tbody').append('<tr id="' + rowId + '"> </tr>');
};

用法：

$('#Table').addNewRow(id1);