如何使用jQuery隐藏空html表格单元格？

Question

我需要的是：
html表格5X7。在许多查询中，填充完整表格的项目少于35个。

在这种情况下，如何使用jQuery（或其他有效方式）动态地“隐藏”空单元格？

谢谢。

Answer 1

编辑 - 改良版

// Grab every row in your table 
$('table#yourTable tr').each(function(){ 
    if($(this).children('td:empty').length === $(this).children('td').length){ 
    $(this).remove(); // or $(this).hide(); 
    } 
}); 

未经测试，但似乎逻辑上的声音。

// Grab every row in your table 
$('table#yourTable tr').each(function(){ 
    var isEmpty = true; 
    // Process every column 
    $(this).children('td').each(function(){ 
    // If data is present inside of a given column let the row know 
    if($.trim($(this).html()) !== '') { 
     isEmpty = false; 
     // We stop after proving that at least one column in a row has data 
     return false; 
    } 
    }); 
    // If the whole row is empty remove it from the dom 
    if(isEmpty) $(this).remove(); 
}); 

Answer 2

显然你要调整选择，以满足您的特定需求：

$('td').each(function(){ 
    if ($(this).html() == '') { 
    $(this).hide(); 
    } 
}); 

Answer 3

$('td:empty').hide(); 

Answer 4

我投票支持Ballsacian的答案。由于某种原因，

$('table#myTable tr:not(:has(td:not(:empty)))').hide(); 

有一个错误。如果你删除最外层：not（），它会做你期望的，但是完整的表达式会使jQuery崩溃。 :)

Answer 5

如何CSS empty-cells

table { 
    empty-cells: hide; 
}