如何在点击时按类别延迟加载图像？

Question

我的网页上有很多图像，因此我使用了延迟加载来提高性能。 我已经使用一个25kb的图像作为所有高清图像的占位符。 通常，在滚动懒惰负载图像时，它们一经显示便会显示，但是这些图像在传送带中，并且只有第一个图像会更改。 我希望单击一个按钮，该按钮还会显示轮播，我可以按类加载新图像？

<img src="./img/tinyBlur.jpg" data-2x-1="./img/design7.png" class="carosuelImg lazyload-2x loading-lazy hidden">

Answer 1

据我了解，我的朋友

var img = document.querySelector("img");
img.classList.remove("hidden");
img.src = img.getAttribute('data-2x-1');