Display与Visibility的区别

源自他人。

1.Display
display被设置为block时显示，设置为none时元素实际上就从页面中被移走，它下面所在的元素就会被自动跟上填充
Java代码
<script language="JavaScript">
function testDisplay(me){
if (me.style.display=="block"){
me.style.display="none";
}
else {
me.style.display="block";
}
}
</script>

111111111
<div οnclick="testDisplay(this)">查看display效果</div>
22222222

<script language="JavaScript">
function testDisplay(me){
if (me.style.display=="block"){
me.style.display="none";
}
else {
me.style.display="block";
}
}
</script>

111111111
<div οnclick="testDisplay(this)">查看display效果</div>
22222222

2.Visibility
visibility属性用来确定元素是显示还是隐藏，这用visibility="visible|hidden"来表示，
visible表示显示，hidden表示隐藏。当visibility被设置为"hidden"的时候，元素虽然被隐藏了，但它仍然占据它原来所在的位置。
Java代码
<script language="JavaScript">
function testVisibility(me){
if (me.style.visibility=="hidden"){
me.style.visibility="visible";
}
else {
me.style.visibility="hidden";
}
}
</script>

33333333
<div οnclick="testVisibility(this)">查看visibility效果</div>
444444444