百度空间 | 百度首页 
               
 
查看文章
  
style.display与style.visibility的区别
2008-10-31 16:44

style.visibility一般取值'visible'或'hidden'进行显示和隐藏，但是元素所占据的网页位置是不释放的，只是看不见。效果就是该位置上空了一块。而style.display一般取值'block'或'none'进行显示和隐藏，不过会释放掉网页上的位置。

例子：

<span style="color:red">它们都可以实现对域的隐藏，但visibility要占用域的空间，而display则不会！下面是一个测试</span>
<html>
<head>
<title>标题测试</title>
<script language="javascript">...
function testVisibility()
...{
document.all("tb_0").style.visibility="hidden";

}
function testDisplay()
...{
document.all("tb_0").style.display="none";

}
function test()
...{
document.all("tb_0").style.visibility="visible";
document.all("tb_1").style.visibility="visible";
document.all("tb_0").style.display="block";
document.all("tb_1").style.display="block";
}
</script>
</head>
<body>
<form name="form" method="post">
<table id="tb_0">
<tr>
<td>内容测试--visible</td>
</tr>
</table>
<table id="tb_1">
<tr>
<td>内容测试--hidden</td>
</tr>
</table>
<input type="button" onClick="test();" value="还原">
<input type="button" onClick="testVisibility();" value="测试visibility">
<input type="button" onClick="testDisplay();" value="测试display">
</form>
</body>
</html>


类别：Javascript | 添加到搜藏 | 浏览() | 评论 (0)
 
最近读者：
 
网友评论：
发表评论：
姓　名：
网址或邮箱： (选填)
内　容：
验证码： 请点击后输入四位验证码，字母不区分大小写
      

     

©2009 Baidu