Style visibility 属性
Style 对象的 visibility 属性设置元素是否应该是可见的
visibility 属性允许作者显示或隐藏一个元素
与 display 属性类似。然而，不同的是，如果设置 display:none，将隐藏整个元素，如果设置 visibility:hidden，元素的内容将不可见，但元素仍保持原来的位置和大小
语法
设置 visibility 属性
object.style.visibility="visible|hidden|collapse|inherit"
返回 visibility 属性
object.style.visibility
值说明
| 值 | 描述 |
|---|---|
| visible | 默认。元素是可见的 |
| hidden | 元素是不可见的，但仍然影响布局 |
| collapse | 当在表格行或单元格中使用时，该元素是不可见的 ( 与 "hidden" 相同 ) |
| inherit | visibility 属性的值从父元素继承 |
浏览器支持
所有主要浏览器都支持 visibility 属性
IE7 及更早的版本不支持 "inherit" 值
IE8 只有在添加了 <!DOCTYPE> 才支持 "inherit"
IE9 支持 "inherit"
范例
隐藏元素的内容
<script> function demoDisplay(){ document.getElementById("p1").style.display="none"; } function demoVisibility(){ document.getElementById("p2").style.visibility="hidden"; } </script> <p id="p1">这是一些文本</p> <p id="p2">这是一些文本</p> <input type="button" onclick="demoDisplay()" value="隐藏显示属性的文本"> <input type="button" onclick="demoVisibility()" value="具有可见性属性的隐藏文本">