在我們想要隐藏頁面中的某個元素時，我們會想到使用css樣式中的hover僞類。通過給元素設定hover屬性進而達到一個隐藏效果。但是這個方法隻适用于隐藏少部分的元素，在後期我們還想要将其他元素進行隐藏的時候會很麻煩，需要一個一個的添加屬性。接下來我們将學會如何使用jQuery隐藏元素hide。
首先先搭建好頁面基礎樣式，放幾個button标簽作為按鈕：
其次我們給标簽設定css樣式，button标簽我們用作為點選事件的。div标簽就作為我們需要隐藏的
元素。我們需要實作的效果是，當我們點選它們相對應的按鈕時會觸發相對應的效果。
當我們點選到方塊一的隐藏元素按鈕時，我們的div1方塊就要進行一個隐藏操作，點選顯示按鈕時div1方塊就要顯示出來。同理第二個方塊也是同樣的操作，當我們第一次點選按鈕的時候方塊就需要隐藏起來，第二次點選就要進行顯示。
這裡需要注意我們在兩個方塊的樣式中都設定了hover僞類。hover屬性中包含樣式隻會在我們滑鼠移到方塊上的時候顯示。想要進行隐藏效果還是需要display屬性。
第二個方塊中我們運用到了css動畫，分别設定了動畫運作的時間，播放函數以及次數等（看圖檔注釋）。
接下來進入正題，兩個方塊我們使用不同的方法進行效果示範。首先方塊一我們直接使用hide（）方法。
先介紹一下speed是指動畫運作的時間，easing：（Optional）是指切換效果，fn：在動畫完成時執行的函數，每個元素執行一次。在我們了解後将他們帶入到方法中使用，動畫運作的時間是可以随意改動的。可以将它的數值改大改小，這是我們會發現動畫運作的速度會大不同。
點選運作就可以看到方塊一的隐藏和顯示效果。要記得再寫jQuery代碼的時候一定要插jQuery插件，否則會報錯。
這裡可以看到div1方塊已經被我們隐藏了，接下來是toggle（）方法。
仔細觀察我們會發現其實兩種方法之間的差别不是很大，隻是toggle（）方法要相對應的簡潔更加的友善。因為我們給第二方塊設定了動畫效果，是以在我們點選按鈕的時候也會觸發css動畫效果。他會慢慢地消失，慢慢的出現。效果就需要自己慢慢的檢視了。