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 onclick="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 onclick="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   onclick="testVisibility(this)">查看visibility效果</div>  
    444444444