javascript - 加载图像后如何设置正文背景图像？

Question

对于我的网站，我使用高分辨率图片作为我 body 的背景。如果我简单地放置 document.body.style.backgroundImage = "url('URL OF PICTURE')";，我可以看到图像垂直加载到页面下方。我只想在文件加载后设置背景图像，并在加载时显示我的默认灰色背景。有什么想法吗？

Answer 1

您可以使用 Image() 加载它，监听 onload，然后在加载时将它添加到 dom。

let img = new Image();

img.onload = function(){
    document.body.style.backgroundImage = "url('" + img.src + "')";
};

img.src = 'imageUrl.jpg';