如何在表中将td高度设置为0px？ [英] How to set td height to 0px in a table?
问题描述
我有一个包含几行的HTML表（这是动态构建的）。所有< tr> s都有一个< td> 里面。
如果一个< td> 里面没有HTML内容，我希望它不可见。
这怎么做？ （不是说HTML内部是动态呈现的，我不想使用 display：none 或< td> 或< tr> ）。
代码示例：
< html>
< body bgcolor =＃E6E6FA>
< table cellSpacing =0cellPadding =0>
< tr>
< td>一个单元格< / td>
< / tr>
< tr>
< td bgcolor =＃FF0000>< / td>
< / tr>
< tr>
< td>两个单元格< / td>
< / tr>
< / table>
< / body>
< / html>
在Firefox中，空TD是不可见的。然而，在IE中，TD的高度为1像素： b
$ b
使用DOM Inspector查看我发现它需要1个像素：
如何设置TD不可见？你可以使用CSS伪选择符：empty > / code>：
#myDynamicTable td：空
{
显示： 没有;
jsFiddle示例： http://jsfiddle.net/vKEBY/6/
如果你想支持IE< 9：
var ieVer = getInternetExplorerVersion（）;
if（ieVer！= -1& ieVer <9.0）{
//对于IE< 9支持
var dynamicTable = document.getElementById（myDynamicTable）;
var TDs = dynamicTable.getElementsByTagName（td）;
for（var i = 0; i< TDs.length; i ++）{
if（TDs [i] .innerHTML ==）{
TDs [i ] .style.display =none;
}
}
}
/ **
*所有学分到微软
* http://msdn.microsoft.com/ en-us / library / ms537509（v = vs.85）.aspx＃ParsingUA
* /
函数getInternetExplorerVersion（）
//返回Internet Explorer的版本或-1
//（表示使用其他浏览器）。
{
var rv = -1; //返回值假定失败。
if（navigator.appName =='Microsoft Internet Explorer'）{
var ua = navigator.userAgent;
var re = new RegExp（MSIE（[0-9] {1，} [\.0-9] {0，}））;
if（re.exec（ua）！= null）rv = parseFloat（RegExp。$ 1）;
}
return rv;
}
jsFiddle示例： http://jsfiddle.net/vKEBY/6/
I have an HTML table containing a few rows (this is built dynamically). All <tr>s have one <td> inside.
If one <td> doesn’t have HTML content inside, I would like it to be invisible.
How can this be done? (Not that the HTML inside is rendered dynamically and I do not want to use display:none or any other property on the <td> or <tr>).
Code sample:
<html>
<body bgcolor="#E6E6FA">
<table cellSpacing="0" cellPadding="0">
<tr>
<td>one cell</td>
</tr>
<tr>
<td bgcolor="#FF0000"></td>
</tr>
<tr>
<td>two cell</td>
</tr>
</table>
</body>
</html>
In Firefox the empty TD is invisible. However, in IE the TD takes up 1 pixel in height:
Looking with DOM Inspector I see that it takes 1 pixel:
How can I set the TD not to be visible? Any scripts I can execute inside the TD?
You can use the CSS pseudo selector :empty:
#myDynamicTable td:empty
{
display: none;
}
jsFiddle example: http://jsfiddle.net/vKEBY/6/
And if you want to support IE<9:
var ieVer = getInternetExplorerVersion();
if (ieVer != -1 && ieVer < 9.0) {
// for IE<9 support
var dynamicTable = document.getElementById("myDynamicTable");
var TDs = dynamicTable.getElementsByTagName("td");
for (var i = 0; i < TDs.length; i++) {
if (TDs[i].innerHTML == "") {
TDs[i].style.display = "none";
}
}
}
/**
* All credits to Microsoft
* http://msdn.microsoft.com/en-us/library/ms537509(v=vs.85).aspx#ParsingUA
*/
function getInternetExplorerVersion()
// Returns the version of Internet Explorer or a -1
// (indicating the use of another browser).
{
var rv = -1; // Return value assumes failure.
if (navigator.appName == 'Microsoft Internet Explorer') {
var ua = navigator.userAgent;
var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
if (re.exec(ua) != null) rv = parseFloat(RegExp.$1);
}
return rv;
}
jsFiddle example: http://jsfiddle.net/vKEBY/6/
这篇关于如何在表中将td高度设置为0px？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
