display,visibility区别

 开门见山讲一下两者的区别

document.getElementById("name").style.display ="none";//隐藏不保留位置

document.getElementById("sex").style.visibility ="hidden";//隐藏占用页面空间

 

读者可以用下面的例子看一下具体结果:

html 部分： 

    <asp:TextBox ID="name" runat="server" Width="100px"  Text="name"></asp:TextBox>

     <asp:TextBox ID="sex"  runat="server" Width="100px"   Text="sex"></asp:TextBox>

     <asp:TextBox ID="pass" runat="server" Width="100px"  Text="pass"></asp:TextBox> 

 <input type ="button" value="隐藏"  onclick =" yincan()"/>

 

js部分: 

     function  yincan()

     {

        document.getElementById("name").style.display ="none";//隐藏不保留位置

        document.getElementById("sex").style.visibility ="hidden";//隐藏占用页面空间

     } 

 

 name被隐藏不保留位置,sex 被隐藏保留位置，效果就是有一块空白部分