// 图片懒加载
const images = document.querySelectorAll("img");
const callback = entries => {
entries.forEach(entry => {
if (entry.isIntersecting) {
const image = entry.target;
const data_src = image.getAttribute("data-src");
image.setAttribute("src", data_src);
observer.unobserve(image);
console.log("触发");
};
});
};
const observer = new IntersectionObserver(callback);
images.forEach(image => {
observer.observe(image);
});
把所有需要懒加载的图片的src属性替换成如下即可:
<a href="#"><img data-src="./img/tmp/tmp5.jpg"></a>