可通过监听img的load/error事件并结合complete和naturalWidth属性统计图片加载状态，动态图片需用MutationObserver监听新增节点。
可以通过监听图片的 load 和 error 事件，配合计数器统计成功加载和失败的图片数量。
监听页面内所有 <img> 标签
页面加载完成后，遍历所有 <img> 元素，为每个设置事件监听：
- 用
document.querySelectorAll('img')获取全部图片节点 - 对每个图片分别监听
load（加载成功）和error（加载失败）事件 - 注意：已缓存或立即完成加载的图片可能在监听前就触发了事件，可用
complete属性提前判断
处理图片是否已加载完成
有些图片可能在 JS 执行前已完成加载（比如内联、缓存命中），需主动检查状态：
-
img.complete === true表示图片已加载完毕（无论成功或失败） -
img.naturalWidth > 0可辅助判断是否加载成功（仅适用于load后或complete为 true 时） - 若
complete为 true 且naturalWidth === 0，大概率加载失败（如 404）
实时统计并更新计数
定义两个变量分别记录成功与失败数量，每次触发对应事件时递增：
- 监听
load时，成功计数 +1 - 监听
error或发现complete && naturalWidth === 0时，失败计数 +1 - 可将结果存在全局对象或通过
console.log/ 自定义回调输出
兼容动态插入的图片
如果页面后续通过 JS 动态添加 <img>，需额外监听：
立即学习“Java免费学习笔记（深入）”；
- 使用
MutationObserver监听 DOM 中新增的img元素 - 对新插入的图片立即绑定
load/error事件 - 避免遗漏异步渲染内容（如 SPA 路由切换后的新图片）
