js jQuery顯示隱藏div的幾種方法

aaadiv>

js隱藏和顯示div的方式有兩種：

方式1：隱藏後釋放占用的頁面空間

通過設定display屬性可以使div隱藏後釋放占用的頁面空間.

style="display: none;"document.getelementbyid("demo").style.display="none";//

隱藏document.getelementbyid("demo").style.display="";//
顯示

方式2：隱藏後仍占有頁面空間，顯示空白

div的visibility可以控制div的顯示和隱藏，但是隱藏後頁面顯示空白.

style="visibility: none;"document.getelementbyid("demo").style.visibility="hidden";//
隱藏document.getelementbyid("demo").style.visibility="visible";//
顯示

注意：

使用第二方式更人性化，但是，用div.style.display="none"隱藏會引起，div裡面的東西休眠，裡面的事件就不響應了。

jquery隱藏和顯示div的方式

1、$("#demo").attr("style","display:none;");//

隱藏div
$("#demo").attr("style","display:block;");//
顯示div
2、$("#demo").css("display","none");//
隱藏div
$("#demo").css("display","block");//
顯示div
3、$("#demo").hide();//
隱藏div
$("#demo").show();//
顯示div
4、$("#demo").toggle(//
動態顯示和隱藏
function
() ,
function
()       );

注：

$("#demo").show()表示display:block, 

$("#demo").hide()表示display:none;

1和2中的display:none可以換成visibility:hidden，display:block可以換成visibility:visible.兩者的區別是前者隱藏後不佔空間，而後者隱藏後會佔空間

JS jQuery顯示隱藏div的幾種方法

div id demo aaa div js隱藏和顯示div的方式有兩種 方式1 隱藏後釋放占用的頁面空間 通過設定display屬性可以使div隱藏後釋放占用的頁面空間.style display none document.getelementbyid demo style.display no...

div顯示隱藏

內容 div的visibility可以控制div的顯示和隱藏，但是隱藏後頁面顯示空白 style visibility none document.getelementbyid typediv1 style.visibility hidden 隱藏 document.getelementbyid t...

div顯示隱藏

div的visibility可以控制div的顯示和隱藏，但是隱藏後頁面顯示空白 style visibility none document.getelementbyid typediv1 style.visibility hidden 隱藏 document.getelementbyid type...