`
java虫
  • 浏览: 532627 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Display与Visibility的区别

 
阅读更多
记录一下Display与Visibility的区别,用下面的例子看下效果就可以了。
1.Display
  display被设置为block时显示,设置为none时元素实际上就从页面中被移走,它下面所在的元素就会被自动跟上填充
<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"的时候,元素虽然被隐藏了,但它仍然占据它原来所在的位置。
<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
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics