JQuery - 设置TBODY

Question

我有一个如下所示的表：

<table id="myTable" cellpadding="0" cellspacing="0">
  <thead><tr>
    <th>Date</th>
    <th>First Name</th>
    <th>Last Name</th>
  </tr></thead>

  <tbody>
    <!-- rows will go here -->
  </tbody>
</table> 

我将尝试使用JavaScript在运行时动态填充'myTable'表格。为此，我将使用JQuery。我想要将一些HTML代码写入'myTable'中tbody元素。然而，我不太清楚如何使用选择器来实现这一点。我知道可以通过以下方式获取'myTable'：

$("#myTable")

我知道可以使用以下方式设置myTable的HTML：

$("#myTable").html(someHtmlString);

然而，那样会设置整个表格的HTML。实际上，我只想设置'myTable'中TBODY内的HTML。我该如何使用JQuery来做到这一点？

谢谢！

- Villager

---

这个问题已经解决了吗？ - user113716

Answer 1

你会使用：

$("#myTable > tbody");

这个选择器选取的是直接作为 #myTable 子元素的 tbody 元素。

另外，您也可以使用以下代码：

$('tbody', '#myTable');

这个代码会在#myTable元素的范围内查找所有的tbody元素。

在jQuery中，通常有多种方法可以实现你需要的功能。

另一种方法是：

$('#myTable').children('tbody');

这与我上面的第一个解决方案实际上是相同的。

jQuery文档非常好：

选择器：http://api.jquery.com/category/selectors/

遍历：http://api.jquery.com/category/traversing/

- user113716

Answer 2

找到tbody元素，如果你想添加行，请使用append方法，如果你想替换所有行，请使用html方法。

$('#myTable tbody').append(someRowHtml);

$('#myTable tbody').html(someRowHtml);

请注意，如果您有多个tbody元素，则还需要使用:first选择器（或nth-child - 不要忘记，尽管它是从零开始的，但您有一个thead元素）来获取正确的元素。

$('#myTable tbody:first').append(...);

- tvanfosson

---

不需要使用函数来查找tbody。 - Gert Grenander

@Gert G - 我写完后就意识到了。不过，如果你已经有了对表的引用，那么这将是正确的方法。 - tvanfosson

Answer 3

$("#myTable tbody").html(someHtmlString);

- Reigel Gallarde

Answer 4

尝试使用 $("#myTable > tbody").html("");。

- Georg Leber

Answer 5

尝试：

$("#myTable tbody")

- Davide Ungari

Answer 6

你可以这样做：

$("#myTable tbody").html(html_here);

- Sarfraz

Answer 7

$('#myTable tbody').append('<tr><td>foo</td><td>bar</td></tr>');

- Richard Rail

Answer 8

给你的tbody一个id，然后像你对表格所做的那样对它进行操作。

< tbody id='myTbody' >

- sushil bharwani