HTML DOM Style emptyCells 属性

月间摘星

Style emptyCells 属性


定义和用法

emptyCells 属性设置或返回是否显示表格中的空单元格的边框和背景。

语法

设置 emptyCells 属性:


Object.style.emptyCells="show|hide|inherit"

返回 emptyCells 属性:


Object.style.emptyCells

描述
show 显示空单元格的边框和背景,即在空单元格周围绘制边框。
hide 隐藏空单元格的边框和背景,即不在空单元格周围绘制边框。
inherit emptyCells 属性的值从父元素继承。


浏览器支持

HTML DOM Style emptyCells 属性HTML DOM Style emptyCells 属性HTML DOM Style emptyCells 属性HTML DOM Style emptyCells 属性HTML DOM Style emptyCells 属性

所有主要浏览器都支持 emptyCells 属性。

注意:不同浏览器中的默认值不同。在 IE、Chrome 和 Safari 浏览器中,默认值是 "show",而在 Firefox 和 Opera 浏览器中,默认值是 "hide"。

注意:IE7 及更早的版本不支持 emptyCells 属性。IE8 只有规定了 !DOCTYPE 才支持 emptyCells 属性。IE9 支持 emptyCells 属性。


实例

改变空单元格的显示方式:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<script>
function show(){
    document.getElementById("myTable").style.emptyCells="show";
}
function hide(){
    document.getElementById("myTable").style.emptyCells="hide";
}
</script>
</head>
<body>

<table id="myTable" border="1">
    <tr>
        <th>Month</th>
        <th>Savings</th>
    </tr>
    <tr>
        <td>January</td>
        <td>$100</td>
    </tr>
    <tr>
        <td>February</td>
        <td></td>
    </tr>
</table>
<br>
<button type="button" onclick="show()">显示空单元格</button>
<button type="button" onclick="hide()">隐藏空单元格</button>
<p><b>注意:</b> Internet Explorer 8 及更早版本要支持empty-cells属性必须声明 !DOCTYPE 。</p>

</body>
</html>


版权声明:本页面内容旨在传播知识,为用户自行发布,若有侵权等问题请及时与本网联系,我们将第一时间处理。E-mail:284563525@qq.com

目录[+]

取消
微信二维码
微信二维码
支付宝二维码