懒加载脚本调整需求：修改为文档完全就绪后加载对应背景图片

调整后代码 #

CSS部分无需修改，保持原逻辑即可：

.hiddenbackground {background-image: none !important;}

JS部分直接替换原有脚本即可：

<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
  // 获取所有设置了懒加载背景的元素
  var lazyBackgrounds = document.querySelectorAll(".hiddenbackground");
  // 直接遍历移除隐藏背景类，触发全部背景图立即加载
  lazyBackgrounds.forEach(function(lazyBackground) {
    lazyBackground.classList.remove("hiddenbackground");
  });
});
</script>

修改逻辑说明 #

原脚本依赖IntersectionObserver监听元素进入可视区域的事件，只有元素出现在视口才会移除hiddenbackground类加载背景图。修改后直接删除了交叉观察者相关的所有逻辑，在DOM加载完成事件触发后直接遍历所有目标元素移除隐藏类，就会立即触发所有背景图的加载请求，不需要等待滚动操作。

内容的提问来源于stack exchange，提问作者Jason Howard