隐藏目录，当TBODY失踪

我的程序生成的表，有的用tbody，有些没有tbody：隐藏目录，当TBODY失踪

table { 
 
    border: 1px solid black; 
 
    margin: 0 0 20px 0; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<table> 
 
    <thead> 
 
    <tr> 
 
     <th>Month</th> 
 
     <th>Savings</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>January</td> 
 
     <td>$100</td> 
 
    </tr> 
 
    <tr> 
 
     <td>February</td> 
 
     <td>$80</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 

 
<table> 
 
    <thead> 
 
    <tr> 
 
     <th>Month</th> 
 
     <th>Savings</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>January</td> 
 
     <td>$100</td> 
 
    </tr> 
 
    <tr> 
 
     <td>February</td> 
 
     <td>$80</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 

 
<table> 
 
    <thead> 
 
    <tr> 
 
     <th>Month</th> 
 
     <th>Savings</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    </tbody> 
 
</table>

是否有通过该表中没有如果tbody显示任何方式不见了？（如在第三个表）

来源

2015-02-10 Zombyii

不可靠，因为如果省略了大多数浏览器将插入''（尽管“”是可选元素）;这意味着你必须用正则表达式解析HTML：并且你应该（可能）[永远不要用正则表达式解析HTML]（http://stackoverflow.com/a/1732454/82548）。但更仔细地看待你的问题，你似乎意思是“......如果'tbody'是'空'*'而不是'缺少'？ – 2015-02-10 12:14:17

可以尝试浏览所有table，检查该表的TBODY是空的：如果仅仅使用HTML和CSS，你不要

$("table").each(function(i,v){ 
 
    if($(this).find("tbody").html().trim().length === 0){ 
 
     $(this).hide() 
 
    } 
 
})

table { 
 
    border: 1px solid black; 
 
    margin: 0 0 20px 0; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<table> 
 
    <thead> 
 
    <tr> 
 
     <th>Month</th> 
 
     <th>Savings</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>January</td> 
 
     <td>$100</td> 
 
    </tr> 
 
    <tr> 
 
     <td>February</td> 
 
     <td>$80</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 

 
<table> 
 
    <thead> 
 
    <tr> 
 
     <th>Month</th> 
 
     <th>Savings</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>January</td> 
 
     <td>$100</td> 
 
    </tr> 
 
    <tr> 
 
     <td>February</td> 
 
     <td>$80</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 
<table> 
 
    <thead> 
 
    <tr> 
 
     <th>Month</th> 
 
     <th>Savings</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    </tbody> 
 
</table>

来源

2015-02-10 12:11:03 Hacketo

谢谢谢谢，我忘记了这个变种 – Zombyii 2015-02-10 12:16:04

不想显示未填充的表格，只需从您的html代码中删除第三个表格或将其添加到您的第三个表格中

<table style="display:none"> 
... 
</table>

编辑：如果您使用的是PHP的Javascript，JSTL，您可以修改您的视图以隐藏表格

来源

2015-02-10 12:12:33 mgamon

试试这个。检查每个表是否有tbody有子元素。

$("table").each(function(){ 
    if($(this + "tbody").children().length == 0){ 
     $(this).parent().hide(); 
    } 
})

来源

2015-02-10 12:13:01 user2232273

谢谢，它很好:) – Zombyii 2015-02-10 12:19:30

欢迎你。 – user2232273 2015-02-10 12:20:10

你可以尝试检查，如果TBODY是空

$("table").each(function(i,v){ 
    if($(this).find("tbody").children().length){ 
     $(this).parent().hide(); 
    } 
})

来源

2015-02-10 12:14:49 chridam

非常感谢你 – Zombyii 2015-02-10 12:20:38

可以使用jQuery.filter功能定位具有空tbody所有表，并隐藏他们：

$("table").filter(function(){ 
    return $(this).find("tbody > *").length === 0; 
}).hide();

来源

2015-02-10 12:20:28

漂亮的变种：D非常感谢你 – Zombyii 2015-02-10 12:22:09

你可以用.has()函数做到这一点。

首先隐藏所有表：

$("table").hide();

然后只显示有那些一个tbody：

$("table").has("tbody").show();

或者，如果tbody有细胞（不为空）：

$("table").has("tbody td").show();

JSFiddle demo

来源

2015-02-10 12:52:29

谢谢你，它的好例子：D – Zombyii 2015-02-10 13:47:13

隐藏目录，当TBODY失踪

回答

相关问题