如何从表格中删除多余的空白行？答案

【问题标题】：How can I remove extra blank row from the table?如何从表格中删除多余的空白行？
【发布时间】：2022-01-19 03:17:05
【问题描述】：

当我将数据插入表格时，它会自动在底部插入一行。如何从表格中删除多余的空白行

<table>
    <tr>
        <th>Name</th>
        <th>Comment</th>
        <th>Posted Date</th>
    </tr>
    <tr>
        <td id ="result_name"></td>
        <td id="result_comment"></td>
        <td id="posteddate"></td>
    </tr>
</table>

【问题讨论】：

你能提供一张显示这个效果的截图吗？
我假设您的意思是，如果值为空，那么您希望隐藏 tr？这个html是怎么生成的？

标签： html html-table

【解决方案1】：

添加可见性样式：折叠

<html>
<table border="1">
    <tr>
        <th>Name</th>
        <th>Comment</th>
        <th>Posted Date</th>
    </tr>
    <tr style="visibility:collapse">
        <td id="result_name"></td>
        <td id="result_comment"></td>
        <td id="posteddate"></td>
    </tr>
</table>
</html>

【讨论】：

【解决方案2】：

您可以尝试使用 jquery 来实现：

$("td").each(function() {
    if (this.innerText === '') {
    this.closest('tr').remove();
    }
});

这个函数会检查所有的“td”，如果里面没有任何文字，就删除它们。

【讨论】：

【解决方案3】：

您可以使用jQuery函数来检查数据是否为空。

$("td").each(function() {
    if (this.innerText === '') {
    this.closest('tr').remove();
    }
});

    <table>
    <tr>
        <th>Name</th>
        <th>Comment</th>
        <th>Posted Date</th>
    </tr>
    <tr>
        <td id ="result_name"></td>
        <td id="result_comment"></td>
        <td id="posteddate"></td>
    </tr>
</table>

【讨论】：