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

<

div 
id="demo"
>aaa
div>

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;

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

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

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...