【javascript】複数あるclassに対して処理を行う

スポンサーリンク
Javascript
スポンサーリンク

javascriptで要素を取得する時、idで指定すると1つの要素を指定して処理が行われますので簡単なのですが、classは複数存在する可能性があるものですのでループ処理を行う必要があります。

idの場合はHTMLのルール上、1ページに1つしか存在しないことになっているので、

const id1 = document.getElementById('target'); //id=targetという要素を取得
id1.classList.add('c_bold'); //c_boldというclassを付与

という記述で済みます。(ルールを無視して2つ以上ある場合は最初に出現するidを対象にします。)

 

classの場合は複数存在する前提ですのでそれぞれに処理が必要です。

ただ、idのように一つの処理だと複数のclassに適応させることが出来ません。
複数の対象がある場合はループ処理をする必要があります。

let class_all= document.getElementsByClassName("target");
Array.prototype.forEach.call(class_all, function (class) {
   class.classList.add("c_bold");
});

 

コメント

タイトルとURLをコピーしました