HTML DOM visibility 属性
JavaScript基础 2022-06-08 14:49:29小码哥的IT人生shichen
HTML DOM visibility 属性
定义和用法
visibility 属性设置元素是否可见。
语法:
Object.style.visibility=visible|hidden|collapse
可能的值
值 | 描述 |
---|---|
visible | 默认。元素框是可见的。 |
hidden | 元素框不可见,但仍然影响布局。 |
collapse | 当在表格元素中使用时,此值可删除一行或一列,但是它不会影响表格的布局。被行或列占据的空间会留给其他内容使用。如果此值被用在其他的元素上,会呈现为 "hidden"。 |
实例
下面的例子隐藏一段文本:
<html>
<head>
<script type="text/javascript">
function changeVisibility()
{
document.getElementById("p1").style.visibility="hidden";
}
</script>
</head>
<body>
<p id="p1">This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>
<form>
<input type="button" onclick="changeVisibility()"
value="Hide paragraph" />
</form>
</body>
</html>
TIY
完整实例【visibility - 隐藏一段文本】:
<html>
<head>
<script type="text/javascript">
function changeVisibility()
{
document.getElementById("p1").style.visibility="hidden";
}
</script>
</head>
<body>
<p id="p1">This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>
<input type="button" onclick="changeVisibility()" value="Hide text" />
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html