在设计网页时，有时需要静态或动态地隐藏标签或显示被隐藏的标签，那该怎么实现呢？
一 与标签隐藏与否有关的样式
- visibility
标签的visibility样式为""(空)时是显示状态，为"hidden"时是隐藏状态；
"hidden"时，标签不占位置； - display
标签的display样式为""(空)时是显示状态，为"none"时是隐藏状态；
"none"时，标签占据位置；
二 如何更改
-
通过HTML的标签来改
改display有一种方法：
<h1 id="a" style="display: none">Hello World!</h1>改visibility则有两种方法（二者是等价的）：
<h1 id="a" style="visibility: hidden">Hello World!</h1> <h1 id="a" hidden>Hello World!</h1> -
通过javascript来改
改display：document.getElementById("ID").style.display = 'none'; //使标签隐藏 document.getElementById("ID").style.display = ''; //使标签显示改visibility：
document.getElementById("ID").style.visibility = 'hidden'; //使标签隐藏 document.getElementById("ID").style.visibility = ''; //使标签显示用js时，记得要说明更改对象的属性是style！
最后附上高清代码实例：
<!doctype html>
<html lang="zh">
<head>
<meta charset="utf-8">
</head>
<body>
<h1 id="a" style="display: none">Hello World!</h1>
<h1 id="b">Hello cnblogs!</h1>
<script>
a.style.visibility = 'hidden'; //占据位置
a.style.visibility = ''; //占据位置
a.style.display = 'none'; //不占据位置
a.style.display = ''; //不占据位置
</script>
</body>
</html>