如何使用 jQuery 或 JavaScript 有效处理网页中的损坏图像？

使用 jQuery 或 JavaScript 处理损坏的图像

问题：
包含大量图像的网页遇到损坏图像实例由于

jQuery 方法：

1. 获取图像元素：$("img")。
2. 过滤损坏的图像：$brokenImages = $("img").filter(function() { return this.complete && !this.naturalWidth; }).
3. 用占位符图像替换 'src' 属性： $brokenImages.attr("src", "/broken-image.png").

JavaScript onError 事件：

另一种方法是处理每个图像的 onError 事件以重新分配其直接源码。

1. 定义图像错误处理函数：

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

2. 在 HTML 中使用该函数：

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

3. 或者没有函数：

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

浏览器兼容性：

onError 事件处理方式请参考兼容性表：

http://www.quirksmode.org/dom/events/error.html

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