首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何在表格中将td高度设置为0px?

如何在表格中将td高度设置为0px?
EN

Stack Overflow用户
提问于 2012-04-02 15:47:01
回答 2查看 7.6K关注 0票数 5

我有一个包含几行的HTML表(这是动态构建的)。所有的<tr>都有一个<td>

如果一个<td>里面没有超文本标记语言的内容,我希望它是不可见的。

如何做到这一点?(并不是说里面的超文本标记语言是动态呈现的,我不想在<td><tr>上使用display:none或任何其他属性)。

代码示例:

代码语言:javascript
运行
复制
<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>

在Firefox中,空的TD是不可见的。然而,在IE中,TD占据了1个像素的高度:

使用DOM Inspector查看,我发现它需要1个像素:

如何将TD设置为不可见?有什么脚本可以在TD中执行吗?

EN

Stack Overflow用户

回答已采纳

发布于 2012-04-02 15:55:27

您可以使用CSS伪选择器:empty

代码语言:javascript
运行
复制
#myDynamicTable td:empty
{
  display: none;
}

jsFiddle示例:http://jsfiddle.net/vKEBY/6/

如果你想支持IE<9:

代码语言:javascript
运行
复制
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示例:http://jsfiddle.net/vKEBY/6/

票数 2
EN
查看全部 2 条回答
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/9972599

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档