onerror需立即设为null防无限循环，否则备用图失败会反复触发；动态图片应提前绑定onerror或用捕获阶段全局监听；路径错误是主因，须优先排查404和大小写、跨域问题。
直接用 onerror 替换 src 并立即设 this.onerror = null，否则备用图再失败会卡死页面。
为什么 onerror="this.src='default.png'" 会卡死
备用图本身也加载失败时，onerror 会再次触发，形成无限循环。浏览器可能卡顿、内存暴涨，甚至崩溃。
必须在替换后立刻切断事件绑定：
onerror="this.src='default.png'; this.onerror=null"- 如果备用图路径仍不可靠（比如也写错了），建议用 base64 占位图兜底，例如
data:image/png;base64,iVBORw0KGgo... - 内联写法只适合静态 HTML；JS 动态创建的
img元素需在插入 DOM 前手动赋值onerror，否则可能来不及绑定就已触发错误
动态插入的图片怎么统一处理
用 document.addEventListener('error', handler, true) 捕获所有未被拦截的资源加载错误，对动态添加的 img 天然友好。
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
立即学习“前端免费学习笔记（深入）”；
- 第三个参数设为
true表示在捕获阶段监听，能确保在错误冒泡前处理（注意：error事件本身不冒泡，但捕获阶段仍可命中） - 务必检查
e.target.tagName === 'IMG'，避免误处理script、link等其他资源的错误 - 替换前建议加防重逻辑，例如
if (!e.target.dataset.handled) { e.target.dataset.handled = '1'; }
路径写错才是最大“隐形杀手”
80% 的“图片加载失败”根本不是 JS 逻辑问题，而是路径没写对。开发者工具 Network 面板里看到 404 就该停手查路径，别急着写 onerror。
- 本地开发时，始终用
./xxx.png而非xxx.png，避免因服务器路由或文件系统差异导致解析失败 - Linux/Unix 服务器严格区分大小写：
IMG.JPG和img.jpg是两个文件 - 跨域图片若没配 CORS，控制台报的是
Blocked by CORS policy，不是 404，这时onerror仍会触发，但换源也无效，得换托管方式
真正难处理的不是“怎么 fallback”，而是 fallback 后要不要再 fallback——比如默认图也挂了，是否要 fallback 到 base64、是否要记录失败次数、是否要上报监控。这些边界情况往往被忽略，但线上一出问题就是静默白屏。
