当文件不存在时，如何在 Javascript 中获取 try/catch 错误？

Question

我通过调用本地文件（而不是 URL）在元素中使用 Javascript 替换背景图像。

如果该文件不存在，我想尝试捕获错误。

所以我尝试了以下代码：

    try {
        thing.style.backgroundImage = str;
    }
    catch (err) {
        console.log(err.message);
        thing.style.backgroundImage = "none";
    }

然而，即使是无意义的文件名似乎也可以通过，并且不会生成错误。更糟糕的是，有时显示的背景图像是空的，有时是上一次调用的图像。

有什么方法可以在这里尝试/捕获错误吗？

Answer 1

我会采纳Barmar 的建议并使用Image()构造函数来获取图像。如果你这样做，你真的不需要 try-catch；您只需调用适当的函数即可设置背景图像。

你可以这样做：

var img = new Image();
img.src = "pathToImage";

img.onerror = function(){ // Failed to load
    thing.style.backgroundImage = "none";
};
img.onload = function(){ // Loaded successfully
    thing.style.backgroundImage = img.src;
};