html table空单元显示,html-table – 隐藏表中的空单元格

我想在表格中隐藏空单元格.这是我的代码：

$(function() {

$(".empty").each(hideCellIfEmpty);

});

function hideCellIfEmpty() {

var theCell = $(this);

if (theCell.html().length == 0) {

hideSoft(theCell);

}

}

function hideSoft(jQElement) {

jqElement.css('visibility', 'hidden');

}

table.empty {

width: 350px;

border-collapse: collapse;

empty-cells: hide;

}

td.empty {

border-style: solid;

border-width: 1px;

border-color: blue;

}

	Title one	Title two
Row Title	value	value
Row Title	value

你可以看到,第二行显示空单元格.但我想隐藏它.而且,我不想使用border-collapse：单独的.这是否可以使用border-collapse隐藏空单元格：崩溃？我也想知道为什么这会显示空单元格.

附：使用border-collapse：单独工作,不显示空单元格.

$(function() {

$(".empty").each(hideCellIfEmpty);

});

function hideCellIfEmpty() {

var theCell = $(this);

if (theCell.html().length == 0) {

hideSoft(theCell);

}

}

function hideSoft(jQElement) {

jqElement.css('visibility', 'hidden');

}

table.empty {

width: 350px;

border-collapse: separate;

empty-cells: hide;

}

td.empty {

border-style: solid;

border-width: 1px;

border-color: blue;

}

	Title one	Title two	Title three
Row Title	value	value	value
Row Title	value		value

但这并没有回答这些问题：

>为什么在边界折叠时显示空单元格：使用折叠？

>为什么边框折叠时不显示空单元格：使用单独的？