如何 - 切換類
使用 JavaScript 在元素上新增和移除類名之間進行切換。
點選按鈕切換類名！
切換類
步驟 1) 新增 HTML
在 id="myDIV" 的 div 元素上新增類名之間進行切換（此示例中使用按鈕切換類名）。
示例
<button onclick="myFunction()">試一試</button>
<div id="myDIV">
這是一個 DIV 元素。
</div>
步驟 2) 新增 CSS
新增一個要切換的類名
示例
.mystyle {
width: 100%;
padding: 25px;
background-color: coral;
color: white;
font-size: 25px;
}
步驟 3) 新增 JavaScript
獲取 id="myDIV" 的 <div> 元素，並在 "mystyle" 類之間進行切換
示例
function myFunction() {
var element = document.getElementById("myDIV");
element.classList.toggle("mystyle");
}
自己動手試一試 »
提示：另請參閱 如何新增類。
提示：另請參閱 如何移除類。
提示：在我們的 JavaScript 參考中瞭解有關 classList 屬性的更多資訊。
