網頁元素如何隱藏/顯示?

有時候在開發網頁時會需要用到隱藏/顯示元素的功能,卻不知道實際該如何操作,本篇就帶大家了解怎麼隱藏元素! 首先,有一點必須知道 CSS中有一個叫做display的屬性,你可以為他設定值, 當display: none;代表隱藏元素,當display: block;以區塊顯示(顯示元素) 由這個原理我們可以推演到顯示隱藏元素,讓我們直接看代碼吧!

jQuery 隱藏、顯示

//假設是id為test的元素

//顯示
$("#test").show()

//隱藏
$("#test").hide()

原生JavaScript 

//假設是id為test的元素

//顯示
document.getElementById("test").style.display = "block"

//隱藏
document.getElementById("test").style.display = "none"

  以上就是Cotpear帶來的隱藏/顯示元素的教學。

本文採用 BY-NC-NC CC 條款授權,如無特別註明均為原創,轉載請註明出處「Hsuan 來自 Cotpear」 及本文網址。
本文網址: https://www.cotpear.com/2020/02/js-hide-show-element-html/
暫無評論

發怖評論 編輯評論


上一篇
下一篇