特定の要素にクラスを追加するにはどうすればいいですか? 質問する

特定の要素にクラスを追加するにはどうすればいいですか? 質問する

すでにクラスを持つ要素があります:

<div class="someclass">
    <img ... id="image1" name="image1" />
</div>

ここで、クラスを追加するdiv(置き換えるのではなく追加する) JavaScript 関数を作成したいと思います。

どうやってやるの?

ベストアンサー1

最新のブラウザのみをターゲットにしている場合:

使用要素.classList.addクラスを追加するには:

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

そして要素.classList.削除クラスを削除するには:

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

Internet Explorer 9 以下をサポートする必要がある場合:

className要素のプロパティに、スペースと新しいクラスの名前を追加します。まず、id参照を簡単に取得できるように、要素に を配置します。

<div id="div1" class="someclass">
    <img ... id="image1" name="image1" />
</div>

それから

var d = document.getElementById("div1");
d.className += " otherclass";

の前のスペースに注意してくださいotherclass。スペースを含めることが重要です。そうしないと、クラス リスト内でその前に来る既存のクラスが損なわれます。

参照MDN の element.className

おすすめ記事