ImageElement.onload 事件是如何工作的？

Question

我真的找不到关于

img

HTML 元素的“onload”事件的文档。

我最近在有人向我建议后在 React 项目中使用它，它似乎在

img

元素完全加载到 DOM 中后触发事件。这就是我所需要的，但我找不到任何关于它的真实文档或事件实际触发的时间。

然后，好像与我的成功相矛盾，我在代码笔（下面链接）中使用它，并得到了几个不同的结果。

我读到一个Here表明事件在“加载图像源”之后触发，这似乎与我观察到的一致。

综上所述，我有两个问题：

1. 有人有指向此事件文档的良好链接吗？它似乎与 document.onload 或 window.onload 无关——这些是我唯一能找到的东西

2. 如果我在追加元素后添加源，然后在事件触发后执行操作，这是否意味着可以安全地假设图像元素已完全加载到页面和样式信息（例如

   img

   元素的最终宽度和高度）是否正确？

代码笔

Answer 1

这是关于浏览器何时在

load

标签上触发

<img>

事件的完整规范：https://html.spec.whatwg.org/multipage/images.html#updating-the-image-data