第一种，隐藏，即不可见。元素仍然存在，所以结构不会改变。
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function removeElement()
{
if (document.getElementById("p1").style.visibility=="visible")
{
document.getElementById("p1").style.visibility="hidden";
}
else {
document.getElementById("p1").style.visibility="visible";
}
}
</script>
</head>
<body>
<h1>Hello</h1>
<p id="p1" style="visibility: hidden;">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="removeElement()"
value="Do not display paragraph" />
</body>
</html>
第二种,元素不显示，可能改变结构。
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function removeElement()
{
if(document.getElementById("p1").style.display=="none")
document.getElementById("p1").style.display="inherit";
else
document.getElementById("p1").style.display="none";
}
</script>
</head>
<body>
<h1>Hello</h1>
<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="removeElement()"
value="Do not display paragraph" />
</body>
</html>
网友评论