1

正如我们所知，我们可以onLoad在元素上调用回调以img加载图像。就像我为它所做的那样：

var i = new Image();
if (crossOrigin) i.crossOrigin = crossOrigin;

i.onload = function () {
  decode && i.decode ? i.decode().then(resolve)["catch"](reject) : resolve();
};

i.onerror = reject;
i.src = src;

但是如果我使用avif或webp带标签的格式，picture我怎么能等待加载事件呢？某事喜欢：

<picture>
    <source srcset="img/photo.avif" type="image/avif">
    <source srcset="img/photo.webp" type="image/webp">
    <img src="img/photo.jpg" alt="Description of Photo">
</picture>
4

1 回答 1

1

有多种方法。您可以使用库，也可以使用 IntersectionObserver API 并添加所需的功能。

此处的 SO 帖子没有重复内容，而是提供了一些您可以根据需要采用的输入。

https://stackoverflow.com/a/54092875/34644

于 2020-11-22T11:17:49.843 回答