为什么使用了FOR循环读不到toDataURL？

Question

要读取某网页，然后将这个网页的图片做裁剪处理，单个图片处理没有任何问题，但是只要把FOR循环放进去，用来批量处理所有图片，就无法读到图片了。
要处理的网站：https://mbd.baidu.com/newspag...
for(vari=0;i{
vartupianwidth=document.getElementsByClassName('contentImglinexRBS')[i].offsetWidth;
vartupianheight=document.getElementsByClassName('contentImglinexRBS')[i].offsetHeight;
tupianheight=tupianheight-20;
vartargetImg=newImage();
targetImg.crossOrigin='';
targetImg.src=document.getElementsByClassName('contentImglinexRBS')[i].getElementsByTagName("img")[0].src;
targetImg.onload=(function(){
varcanvas=document.createElement('canvas');
canvas.width=tupianwidth;
canvas.height=tupianheight;
varcxt=canvas.getContext('2d');
cxt.drawImage(targetImg,0,0);
varclipImage=canvas.toDataURL("image/png",1);
document.getElementsByClassName('contentImglinexRBS')[i].getElementsByTagName("img")[0].src=clipImage;
})(i);
}

Answer 1

图片裁剪document.addEventListener('DOMContentLoaded',function(){letarrImg=document.getElementsByClassName('contentImg');letlen=arrImg.length;for(leti=0;i