JQuery顯示和隱藏div的方式

1.使用attr

$("#id").attr("style","display:none;")---------隱藏div

$("#id").attr("style","display:block")----------顯示div

attr()方法：設置或返回被選元素的屬性和值

用于返回屬性值時返回匹配到的迪歐一個元素的值，。用于設置屬性值時為匹配元素設置一個或多個? 屬性/值? 對

2.使用css

$("#id").css("display","none")-----------隱藏

$("#id").css("display","block")-----------顯示

css()方法：返回或設置匹配的元素的一個或多個樣式屬性

注意：display:none 會使元素在頁面上所占的物理空間也消失，即“看不見，摸不著”

3.使用show? ?hide

效果與display:none? ?類似，“看不見，摸不著”

$("#id").hide()-----------隱藏

$("#id").show()----------顯示

4.使用toggle動態顯示和隱藏

$("#id").toggle(

?????????function?()?{?

??????????????$(this).attr("style","display:none;");--------隱藏div

?????????},

?????????function?()?{????

??????????????$(this).attr("style","display:block;");--------顯示div

?????????}

??????);

5.動態添加和移除元素

添加元素的方法：

append-----------在被選元素內的結尾添加元素

preppend---------在被選元素內的開頭添加元素

after----------------在被選元素后添加元素

before--------------在被選元素前添加元素

移除元素的方法：

remove-------------刪除被選元素及其子元素

empty---------------從被選元素中刪除元素

6.特殊情況——希望頁面保留元素的物理位置，但是不顯示，即“看不見，摸得著”

可以使用visibility:hidden屬性值將元素內容隱藏，但是保留元素在頁面上的位置

總結

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

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