這篇文章主要介紹了display和visibility的區別,需要的朋友可以參考下
display通常可以設置為none、inline、block visibility通常可以設置為hidden、visible 當display為none,visibility為hidden時,元素都會不見。不過其還有不同之處。 display會將元素隱藏掉,並且位置不再被占據,而visibility則是占據原來的位置。 看例子即可明白: 代碼如下: <div id="myDiv" style="width:100px;border:1px solid #aaa;"> <p> </p> </div> <input type="button" onclick="isVisibility(document.getElementById('myDiv'))" value="是否可見visibility" /> <input type="button" onclick="isDisplay(document.getElementById('myDiv'))" value="是否可見display" /> <script> function isVisibility(me){ if (me.style.visibility=="hidden"){ me.style.visibility="visible"; } else{ me.style.visibility="hidden"; } } function isDisplay(me){ if (me.style.display=="none"){ me.style.display="block"; } else{ me.style.display="none"; } } </script>