不用計(jì)算實(shí)現(xiàn) 圖片懶加載

給圖片加上 data-src 屬性

const imgs = document.querySelectorAll("img[data-src]");const config = {rootMargin: "0px",threshold: 0,}; let observer = new IntersectionObserver((entries, self) => {entries.forEach((entry) => {if (entry.isIntersecting) {let img = entry.target;let src = img.dataset.src;if (src) {img.src = src;img.removeAttribute("data-src");}// 解除觀察self.unobserve(entry.target);}}); },config); imgs.forEach((image) => {observer.observe(image); }); 與50位技術(shù)專家面對(duì)面20年技術(shù)見證，附贈(zèng)技術(shù)全景圖

總結(jié)

以上是生活随笔為你收集整理的不用计算实现 图片懒加载的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。