如何使用 jQuery 或 JavaScript 替换损坏的图像？

使用 jQuery 或 JavaScript 替换损坏的图像

网页通常依赖于图像，处理图像不可用的情况至关重要并出现破碎的图像。本文探讨了解决此问题的两种方法：使用 jQuery 库和纯 JavaScript 解决方案。

jQuery 方法

尽管最初考虑用于此任务，但 jQuery 方法事实证明不太简单。要使用 jQuery 实现此目的，您需要：

• 使用 jQuery 的 $() 获取图像集。
• 使用 .filter() 方法过滤损坏的图像。
• 使用替换损坏的图像 src .attr().

纯 JavaScript 解决方案

使用纯 JavaScript 的替代方法更简单、更高效。通过处理图像的 onError 事件，您可以重新分配其来源：

function imgError(image) {
    image.onerror = "";
    image.src = "/images/noimage.gif";
    return true;
}

<img src="image.png" onError="imgError(this);" />

或者，您可以在不使用函数的情况下实现此功能：

<img src="image.png" onError="this.onerror=null;this.src='/images/noimage.gif';" />

兼容性注意事项

需要注意的是，浏览器对错误工具的支持可能会有所不同。有关兼容性详细信息，请参阅原始答案中提供的参考：http://www.quirksmode.org/dom/events/error.html

以上是如何使用 jQuery 或 JavaScript 替换损坏的图像？的详细内容。更多信息请关注PHP中文网其他相关文章！