使用原生JavaScript 從元素中刪除CSS 類別
使用JavaScript 從HTML 元素中刪除CSS 類別無需依賴第三方即可實現-像jQuery 這樣的派對庫。以下是逐步說明:
1.識別目標元素:
使用 document.querySelector() 方法選擇要從中刪除該類別的 HTML 元素。指定元素的 ID 或其他唯一識別碼。
2.使用 classList 屬性:
現代瀏覽器支援每個元素的 classList 屬性。此屬性表示套用於該元素的 CSS 類別的清單。
3.刪除類別:
要刪除類,只需使用 classList.remove() 方法並將類別名稱作為參數傳遞即可。例如:
const element = document.querySelector('#element'); element.classList.remove('red');
範例:
以下程式碼片段示範如何在實際中從元素中刪除「紅色」CSS類別場景:
const button = document.querySelector('#remove'); const element = document.querySelector('#el'); button.onclick = () => { element.classList.remove('red'); };
HTML:
<div>
CSS:
.red { background: red; }
CSS:
「刪除類」時點選按鈕,「紅色」CSS 類別將從元素中刪除,將其背景顏色變更為預設。以上是如何使用本機 JavaScript 從元素中刪除 CSS 類別?的詳細內容。更多資訊請關注PHP中文網其他相關文章!