酷知百科網

位置:首頁 > 遊戲數碼 > IT技術

怎麼用js顯示隱藏div

IT技術2.53W

怎麼用js來顯示或隱藏一個div?很簡單,下面一起來看一下。

操作方法

首先我們創建一個div,和一個按鈕。用按鈕的點擊來控制div的顯示或隱藏。

怎麼用js顯示隱藏div

添加一個樣式名叫hide的樣式,主要是設定display=none,即隱藏。

怎麼用js顯示隱藏div 第2張

接着用js來實現顯示,隱藏的功能。我們用Jquery的hasClass方法來判斷div是否有hide樣式,有則刪除這個樣式,即顯示div。如果沒有,則添加一個hide的樣式,即隱藏div。

怎麼用js顯示隱藏div 第3張

執行頁面,我們點擊按鈕,如果div是正在顯示的,點擊後就會隱藏,如果是隱藏狀態的,點擊後就會顯示。

怎麼用js顯示隱藏div 第4張
怎麼用js顯示隱藏div 第5張
標籤:js DIV