清除表jquery

Posted 2023-03-05

【中文标题】清除表jquery

【英文标题】：clear table jquery

【发布时间】：2011-02-06 21:22:11

【问题描述】：

我有一个 HTML 表格，里面有很多行。

如何删除表格中的所有行？

【参考方案1】：

使用.remove()

$("#yourtableid tr").remove();

如果您想保留数据以供将来使用，即使在删除后也可以使用 .detach()

$("#yourtableid tr").detach();

如果行是表的子项，那么您可以使用子选择器而不是后代选择器，例如

$("#yourtableid > tr").remove();

【讨论】：

注意最后一个：大多数浏览器在 tr 元素周围添加一个隐含的 tbody 元素。

【参考方案2】：

如果要清除数据但保留标题：

$('#myTableId tbody').empty();

表格必须以这种方式格式化：

<table id="myTableId">
    <thead>
        <tr>
            <th>header1</th><th>header2</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>data1</td><td>data2</td>
        </tr>
    </tbody>
</table>

【讨论】：

这是可行的，但这会删除 'tbody' 本身及其内部的所有 'tr'。

你是对的，@HakamFostok。我已经编辑了我的答案，改为使用 empty()

【参考方案3】：

比单独删除一个要快一些：

$('#myTable').empty()

从技术上讲，这也会删除 thead、tfoot 和 tbody 元素。

【参考方案4】：

我需要这个：

$('#myTable tbody > tr').remove();

它会删除除标题之外的所有行。

【参考方案5】：

核选项：

$("#yourtableid").html("");

销毁#yourtableid 内的所有内容。小心你的选择器，因为它会破坏你传递的选择器中的任何 html！

【讨论】：

+1 表示核 :)。但应该明白这不是“最好”的风格:)我一般不会推荐它

哈哈。同意。我过去曾使用这种特殊方法来提高速度和解决困难情况。它在 JQuery 应用程序领域有一些有效的用途。

【参考方案6】：

$("#employeeTable td").parent().remove();

这将删除所有以td 为子级的tr。即除了标题之外的所有行都将被删除。

【讨论】：

这是唯一适合我的。删除除标题以外的所有内容...

【参考方案7】：

这将删除属于正文的所有行，从而保持标题和正文完整：

$("#tableLoanInfos tbody tr").remove();

【参考方案8】：

<table id="myTable" class="table" cellspacing="0" >
    <thead>
        <tr>
            <th>Header 1</th>
            <th>Header 2</th>
            <th>Header 3</th>
        </tr>
    </thead>
    <tbody id="tblBody">

    </tbody>
</table>

然后删除：

$("#tblBody").empty();

【参考方案9】：

  $('#myTable > tr').remove();

【参考方案10】：

有一个这样的表格（带有标题和正文）

<table id="myTableId">
    <thead>
    </thead>
    <tbody>
   </tbody>
</table>

删除 #tableId 中每个具有名为 tbody 的父级的 tr

$('#tableId tbody > tr').remove();

如果你想添加到你的表中，反过来

$('#tableId tbody').append("<tr><td></td>....</tr>");