在JavaScript 中為元素添加類別
簡介:增強元素的功能通常涉及操作元素的功能通常涉及操作其CSS 類。新增類別可以為元素提供附加樣式或行為。此答案說明如何使用 JavaScript 將類別新增至元素,同時考慮對現代瀏覽器和舊版瀏覽器的支援。
現代瀏覽器(Element.classList)對於現代瀏覽器,包括Chrome、Firefox 和Safari,element.classList.add() 方法提供了一種將類別添加到列表的有效方法。元素:
element.classList.add("my-class");稍後刪除該類別:
element.classList.remove("my-class");
舊版瀏覽器(className 屬性)適用於Internet Explorer 9 及更低版本的瀏覽器,元素的className屬性可用來新增新的class:
var d = document.getElementById("div1"); d.className += " otherclass";確保新類別名稱之前有一個空格,以避免損害清單中的現有類別。
注意: element.className 屬性可以是現代瀏覽器中也使用了這種方法,但 classList 通常是一種更乾淨、更有效率的方法。
以上是如何使用 JavaScript 將類別新增至 HTML 元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!