怎麼用js顯示隱藏div

來源:酷知科普網 2.5W

怎麼用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張
熱門標籤