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

Posted 2023-03-05

技术标签:

【中文标题】如何从表格中删除多余的空白行？【英文标题】：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是怎么生成的？ 【参考方案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>

【讨论】：

以上是关于如何从表格中删除多余的空白行？的主要内容，如果未能解决你的问题，请参考以下文章

如何删除excel表格下面的空白行

EXCEL下拉筛选统计了多余未填写空白区域怎么调整？