export function setImagesLazyLoad() {
const pageHeight =
window.innerHeight ||
document.documentElement.clientHeight ||
document.body.clientHeight
const images = document.getElementsByTagName('img')
for (let i = 0; i < images.length; i++) {
const item = images[i]
const { top } = item.getBoundingClientRect()
if (top > 0 && top < pageHeight + 50) {
if (!item.getAttribute('src')) {
item.setAttribute('src', item.getAttribute('data-url'))
}
}
}
}
export function init() {
// 初始化需要执行一下 init 即可
setImagesLazyLoad()
window.addEventListener('pageshow', setImagesLazyLoad)
window.addEventListener('scroll', setImagesLazyLoad)
window.addEventListener('hashchange', setImagesLazyLoad)
window.addEventListener('popstate', setImagesLazyLoad)
}
前端 JS 设置图片懒加载
于 2023-04-03 16:13:25 首次发布