js的Image对象来加载图片,并通过onload和onerror事件监听加载成功和失败的情况,然后分别将图片放到两个数组中。
不能加载
能加载
使用for循环遍历图片URL数组,并为每个URL创建一个Image对象,然后为onload和onerror事件添加相应的回调函数。在回调函数中,将成功和失败的URL分别放到successArray和errorArray中。最后,通过将图片URL赋值给img.src来加载图片。
js代码编译
<script>
// 图片路径数组
const images = [
'https://jquee-dev.oss-cn-beijing.aliyuncs.com/shmetro/a101/a101034399.jpg',
'https://jquee-dev.oss-cn-beijing.aliyuncs.com/shmetro/a101/a101030295.jpg',
'https://jquee-dev.oss-cn-beijing.aliyuncs.com/shmetro/a101/a101026536.jpg',
'https://jquee-dev.oss-cn-beijing.aliyuncs.com/shmetro/a101/a101041099.jpg',
'https://jquee-dev.oss-cn-beijing.aliyuncs.com/shmetro/a101/a101023394.jpg',
'https://jquee-dev.oss-cn-beijing.aliyuncs.com/shmetro/a101/a101019704.jpg',
'https://jquee-dev.oss-cn-beijing.aliyuncs.com/shmetro/a101/a101012745.jpg',
'https://jquee-dev.oss-cn-beijing.aliyuncs.com/shmetro/a101/a101028626.jpg',
'https://jquee-dev.oss-cn-beijing.aliyuncs.com/shmetro/a101/a101049770.jpg',
'https://jquee-dev.oss-cn-beijing.aliyuncs.com/shmetro/a101/a101042448.jpg',
]
const successArray = [];
const errorArray = [];
for (let i = 0; i < images.length; i++) {
const img = new Image();
img.onload = function() {
successArray.push(images[i]);
// console.log(successArray);
};
img.onerror = function() {
errorArray.push(images[i]);
console.log(errorArray);
};
img.src = images[i];
}
</script>