js代碼需要調整

Question

我想讓我網站上的所有圖片在加載完 時都有「Fadein」效果，那麼這段代碼有什麼問題？ ！

<img 
src="http://1.bp.blogspot.com/-M03SoTLlJ4k/Vfwvq2dz42I/AAAAAAAAD9I/o-xN8x6HL2Y/s1600-r/Untitled-1%2B%25281%2529.png" id="image_id"/> 
<style> 
#image_id { 
opacity:0; 
transition:1s; 
} 
</style> 
<script> 
var i; 
var x = document.getElementsByTagName("img"); 
for (i = 0; i < x.length; i++) { 
    document.getElementsByTagName("img")[i].addEventListener("load", imgfadein); 
    }; 
function imgfadein() { 
x[i].style.opacity = "1";   
} 
</script> 

Answer 1

在你的代碼，當事件處理程序運行，i是x.length，所以x[i]沒有設置。

當事件偵聽器函數運行時，this是它綁定到的元素。使用this而不是x[i]。

function imgfacein() { 
    this.style.opacity = "1"; 
}