JQuery顯示隱藏頁面元素的方法總結_jquery

在jquery中顯示隱藏div方法方法有很多種，如比較簡單的函數show(),hide(),toggle(),slideDown()然後還有css設定div的style屬性都可操作，下面我來介紹。

show()方法

顯示出隱藏的

元素。

複製程式碼 程式碼如下:

$(".btn2").click(function(){
  $("p").show();
});

toggle()方法

toggle() 方法切換元素的可見狀態。
如果被選元素可見，則隱藏這些元素，如果被選元素隱藏，則顯示這些元素。

複製程式碼 程式碼如下:

This is a paragraph.

Toggle

slideDown()方法

以滑動方式顯示隱藏的

元素：

複製程式碼 程式碼如下:

$(".btn2").click(function(){
  $("p").slideDown();
});

hide() 方法

隱藏可見的

元素：

複製程式碼 程式碼如下:

$(".btn1").click(function(){
  $("p").hide();
});

這個函數常與show一起使用

css()方法

css() 方法設定或傳回被選元素的一個或多個樣式屬性。

傳回 CSS 屬性
如需傳回指定的 CSS 屬性的值，請使用下列語法：

複製程式碼 程式碼如下:

css("propertyname");
$("p").css("display","none");

看一個實例

複製程式碼 程式碼如下:

 

div裡內容的顯示隱藏特效

 
 
 
 

        1.測試範例

        2.測試範例

        3.測試範例

        4.測試範例

        5.測試範例

        6.測試範例

        7.測試範例

        8.測試範例

        9.測試範例

        0.測試範例