- Published on
JavaScript forループで要素ごとにaddEventListenerを追加するには
- Authors
- Name
- Shou Arisaka / 有坂翔
JavaScriptのforループで要素ごとにaddEventListenerを追加する方法についてメモです。 [].forEach.callを使用します。 以下は例です。
for (i = 0; i < document.getElementsByTagName('img').length; i++){
document.getElementsByTagName('img')[i].addEventListener("mouseover", function(){
console.log(document.getElementsByTagName('img')[i].src)
});
}
↓
window.addEventListener('DOMContentLoaded', function(e){
[].forEach.call(document.querySelectorAll('img'),function(x){
x.addEventListener("mouseover", function(e){
console.log(e.target.src);
});
});
});
or
// window.addEventListener('DOMContentLoaded', function(e){
[].forEach.call(document.querySelectorAll('img'),function(x){
x.addEventListener("mouseover", function(e){
console.log(e.target.src);
});
});
// });
ref:
JavaScript - forループで要素ごとにaddEventListenerを追加したいがうまくいかない(135762)|teratail