关于javascript:JS-如何判断图片加载完毕

应用场景：
有时须要获取图片的尺寸，这须要在图片加载实现当前才能够。

1. img标签的load事件
   这个事件会在图片加载实现之后触发，并执行img绑定的onload函数。
   （onload是这个Image对象的load事件回调，当图片加载实现后执行onload绑定的函数）

src指向地址无图片，img不能加载，始终是loading。

给src一个实在的图片资源地址，当图片加载实现后，p1的内容会变成loaded。
<img id=”img1″ src=”https://t7.baidu.com/it/u=3047886982,1218802067&fm=218&app=92&f=JPEG?w=121&h=75&s=931B56864047C14D4C168302030070DB”>

下面这种形式同样实用于用new Image()形式创立的HTMLImageElement，
如:

图片加载胜利后，控制台会输入 success

2.img标签的complete属性
（HTMLImageElement.complete）
HTMLImageElement 的只读属性 complete 是一个布尔值，示意图片是否齐全加载实现。
如果应用它来判断，应应用计时器，轮询的形式来解决。

HTMLImageElement.complete当图片齐全加载实现时值为 true；否则，值为 false。

以下任意一条为true则认为图片齐全加载实现：（来自mdn）
(1) src和srcset属性都没有指定。
(2) 无srcset属性，同时src属性为空串””。
(3) 图像资源已被齐全获取，并已排队用于渲染/合成。
(4) image元素曾经确定图像是能够应用且筹备好的(如缓存)。
(5) 图像“损坏”。(因为谬误或图像加载被禁用而导致图像加载失败)