javascript div的顯示隱藏

這個需求很簡單

??btn1

??btn2

??btn3

$(function(){

??var?items?=?$('.content?.item');//拿到所有的div

??var?btns?=?$('.nav?button');//拿到所有的按鈕

??btns.on('click'?,?function(){

var?btn?=?$(this);//得到當前點擊的按鈕

var?index?=?btn.index();//當前點擊的順序是第幾個

items.eq(index).show().siblings().hide();

//將items?的第?index?個顯示，其它的全部隱藏

??});//

??//btns.eq(0).click();//如果有必要可以默認觸發第一個按鈕的點擊事件

});這個需求很簡單 比如這樣

btn1btn2btn3 js $(function(){var?items?=?$('.content?.item');//拿到所有的divvar?btns?=?$('.nav?button');//拿到所有的按鈕btns.on('click'?,?function(){var?btn?=?$(this);//得到當前點擊的按鈕var?index?=?btn.index();//當前點擊的順序是第幾個items.eq(index).show().siblings().hide();//將items?的第?index?個顯示，其它的全部隱藏});btns.eq(0).click();//如果有必要可以默認觸發第一個按鈕的點擊事件 });

html Div隱藏問題

實現div隱藏可以通過設置display、visible和div的大小等實現隱藏效果。

CSS display 屬性

display 屬性規定元素應該生成的框的類型。值為none時，此元素不會被顯示。

/*示例*/

div{display:none;}

CSS visibility 屬性

visibility 屬性規定元素是否可見。值為hidden時表示元素是不可見的。

/*示例*/

div{visible:hidden;}

提示:visible:hidden;和display:none;的區別是，即使不可見的元素也會占據頁面上的空間。 "display" 屬性可以用來創建不占據頁面空間的不可見元素。(visible和display屬性的其他可能值可在W3School查看)。

設置DIV的大小實現隱藏

將div的寬度和高度設置為零，也可以達到隱藏的效果。

/*示例*/

width：0px;

height:0px;

overflow:hidden;/*規定當內容溢出元素框時隱藏。防止div大小設置為零，里面的文本卻還是顯示。*/

}div的visibility可以控制div的顯示但是隱藏后頁面顯示空白: style="visibility: none;"document.getElementById("typediv1").style.visibility="hidden";//隱藏document.getElementById("typediv1").style.visibility="visible";/↑/顯示 ...初始化div是隱藏的

traget.style.display="block";

="search('div1');"改成="show('div1');"

總結

以上是生活随笔為你收集整理的div隐藏(设置div隐藏)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。