![見出し画像](https://assets.st-note.com/production/uploads/images/91790500/rectangle_large_type_2_f78215a78a8c6280cb562390a17e30e3.png?width=800)
複数エレメントにイベントリスナー取り付け
var c=document.getElementsByClassName('button')
for(var i=0,l=c.length;i<l;i++){
(function(e){
e.addEventListener('touchstart',function(_e){
console.log(e.className, e.id)
}
})(c.item(i))
}
複数のエレメントをクラス名で取得
取得したものはHTMLコレクション(疑似配列)として帰ってくる
コレクションはitem()でアクセスできる
問題はforの変数iをそのまま使うと全てのイベントリスナーが変数の最後の指定になってしまうので、変数iを固定化しなければならない
即時実行関数の引数として各エレメントを渡すことで変数iを固定化することが可能
この記事が気に入ったらサポートをしてみませんか?