jQuery中最后一行向表中添加额外行的最佳方法是什么？
这可以接受吗？
$('#myTable').append('<tr><td>my data</td><td>more data</td></tr>');
你可以添加到这样的表（例如输入，选择，行数）的限制是什么？
jQuery中最后一行向表中添加额外行的最佳方法是什么？
这可以接受吗？
$('#myTable').append('<tr><td>my data</td><td>more data</td></tr>');
你可以添加到这样的表（例如输入，选择，行数）的限制是什么？
你建议的方法不能保证给你你想要的结果 - 如果你有一个 tbody 例如：
<table id="myTable">
<tbody>
<tr>...</tr>
<tr>...</tr>
</tbody>
</table>
你最终会得到以下结果：
<table id="myTable">
<tbody>
<tr>...</tr>
<tr>...</tr>
</tbody>
<tr>...</tr>
</table>
因此，我建议采用这种方法：
$('#myTable tr:last').after('<tr>...</tr><tr>...</tr>');
你可以包括任何内容 after() 方法，只要它是有效的HTML，包括上面例子中的多行。
更新： 在此问题的最近活动之后重新回答这个答案。没有眼皮的评论总会有一个很好的评论 tbody 在DOM中;这是事实，但前提是至少有一行。如果你没有行，就没有了 tbody 除非你自己指定了一个。
DaRKoN_ 提示 附加到 tbody 而不是在最后一个之后添加内容 tr。这解决了没有行的问题，但仍然没有防弹，因为理论上你可以有多个 tbody 元素和行将添加到每个元素。
权衡一切，我不确定是否有单一的单线解决方案可以解决每一种可能的情况。您需要确保jQuery代码与您的标记一致。
我认为最安全的解决方案可能是确保你的 table 总是包括至少一个 tbody 在您的标记中，即使它没有行。在此基础上，您可以使用以下内容，但是您可以使用多行（并且还可以使用多个行） tbody 元素）：
$('#myTable > tbody:last-child').append('<tr>...</tr><tr>...</tr>');
jQuery有一个内置的工具来动态操作DOM元素。
您可以像这样向表中添加任何内容：
$("#tableID").find('tbody')
.append($('<tr>')
.append($('<td>')
.append($('<img>')
.attr('src', 'img.png')
.text('Image cell')
)
)
);
该 $('<some-tag>') jQuery中的东西是一个可以有几个的标记对象 attr 可以设置和获取的属性，以及 text，表示标签之间的文字： <tag>text</tag>。
这是一些非常奇怪的缩进，但是你更容易看到这个例子中发生了什么。
从那时起事情发生了变化 @Luke Bennett 回答了这个问题。这是一个更新。
jQuery从版本1.4（？）自动检测您是否尝试插入元素（使用任何一个 append()， prepend()， before()， 要么 after() 方法）是一个 <tr> 并将其插入第一个 <tbody> 在你的表中或将其包装成新的 <tbody> 如果一个不存在。
所以是的，您的示例代码是可以接受的，并且可以与jQuery 1.4+一起使用。 ;）
$('#myTable').append('<tr><td>my data</td><td>more data</td></tr>');
如果你有一个怎么办？ <tbody> 和a <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>");
我知道你已经要求了一个jQuery方法。我看了很多，发现我们可以通过以下函数直接使用JavaScript来更好地完成它。
tableObject.insertRow(index)
index是一个整数，指定要插入的行的位置（从0开始）。也可以使用-1的值;这导致新行将插入最后一个位置。
Firefox和中需要此参数 歌剧，但它在Internet Explorer中是可选的， 铬 和 苹果浏览器。
如果省略此参数， insertRow() 在Internet Explorer的最后一个位置以及Chrome和Safari中的第一个位置插入一个新行。
它适用于HTML表的每个可接受的结构。
以下示例将在last中插入一行（-1用作索引）：
<html>
<head>
<script type="text/javascript">
function displayResult()
{
document.getElementById("myTable").insertRow(-1).innerHTML = '<td>1</td><td>2</td>';
}
</script>
</head>
<body>
<table id="myTable" border="1">
<tr>
<td>cell 1</td>
<td>cell 2</td>
</tr>
<tr>
<td>cell 3</td>
<td>cell 4</td>
</tr>
</table>
<br />
<button type="button" onclick="displayResult()">Insert new row</button>
</body>
</html>
我希望它有所帮助。
我建议
$('#myTable > tbody:first').append('<tr>...</tr><tr>...</tr>');
而不是
$('#myTable > tbody:last').append('<tr>...</tr><tr>...</tr>');
该 first 和 last 关键字适用于要启动的第一个或最后一个标记，而不是关闭。因此，如果您不希望更改嵌套表，而是添加到整个表中，则嵌套表会更好。至少，这是我发现的。
<table id=myTable>
<tbody id=first>
<tr><td>
<table id=myNestedTable>
<tbody id=last>
</tbody>
</table>
</td></tr>
</tbody>
</table>
在我看来，最快捷，最明确的方式是
//Try to get tbody first with jquery children. works faster!
var tbody = $('#myTable').children('tbody');
//Then if no tbody just select your table
var table = tbody.length ? tbody : $('#myTable');
//Add row
table.append('<tr><td>hello></td></tr>');
这是演示 小提琴
此外，我可以推荐一个小函数来进行更多的html更改
//Compose template string
String.prototype.compose = (function (){
var re = /\{{(.+?)\}}/g;
return function (o){
return this.replace(re, function (_, k){
return typeof o[k] != 'undefined' ? o[k] : '';
});
}
}());
如果您使用我的字符串编辑器，您可以这样做
var tbody = $('#myTable').children('tbody');
var table = tbody.length ? tbody : $('#myTable');
var row = '<tr>'+
'<td>{{id}}</td>'+
'<td>{{name}}</td>'+
'<td>{{phone}}</td>'+
'</tr>';
//Add row
table.append(row.compose({
'id': 3,
'name': 'Lee',
'phone': '123 456 789'
}));
这是演示 小提琴