Vanilla JavaScript を使用して CSS クラスを削除するには?

CSS クラスの削除: 包括的な JavaScript ガイド

バニラ JavaScript を使用して要素から CSS クラスを削除することは、Web 開発者が遭遇する一般的なタスクです。簡略化された API を提供する jQuery とは異なり、JavaScript はこの操作に対して多用途かつ低レベルのアプローチを提供します。

CSS クラスを効果的に削除するには、classList プロパティを利用するのが推奨される標準化された手法です。最新のブラウザでサポートされており、正確なクラス操作が可能です。

解決策

次のスニペットは、適切な構文を示しています。

ELEMENT.classList.remove("CLASS_NAME");

このコード スニペット指定されたクラス (CLASS_NAME) をターゲット要素から削除します(ELEMENT).

例

次の例を考えてみましょう。ここには、div からの「red」クラスの削除を切り替えるボタンがあります。

remove.onclick = () => {
  const el = document.querySelector('#el');
  el.classList.remove("red");
};

.red {
  background: red
}

<div>

「クラスを削除」ボタンをクリックすると、「赤色」背景は div から削除されます。

JavaScript で CSS クラスを削除する方法を理解することは、要素スタイルを正確に制御して動的な Web ページを維持するために重要です。

以上がVanilla JavaScript を使用して CSS クラスを削除するには?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。