JavaScript を使用して HTML 要素にクラスを追加するにはどうすればよいですか?

既存の要素へのクラスの追加

HTML では、CSS を使用して要素にクラスを割り当て、スタイル化および識別できます。場合によっては、JavaScript を使用して既存の要素に追加のクラスを動的に追加する必要があります。このチュートリアルでは、これを実現するための、最新のブラウザと従来のブラウザに対応する 2 つの方法について説明します。

最新のブラウザ (IE9 ):

classList プロパティは、要素のクラス。クラスを追加する方法は次のとおりです:

element.classList.add("my-class");

レガシー ブラウザ (IE8 以降):

古いブラウザの場合は、className プロパティを直接操作する必要があります。ただし、要素内に存在する既存のクラスを慎重に考慮する必要があります。

手順:

1. JavaScript で簡単にアクセスできるように、要素に ID を割り当てます。
2. 次の JavaScript コードを使用して、 class:

var d = document.getElementById("elementID");
d.className += " new-class";

既存のクラスが上書きされないように、新しいクラス名の前に必ずスペースを含めてください。

以上がJavaScript を使用して HTML 要素にクラスを追加するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。