web网站一般怎么处理图片容错的问题？

Question

在网站中，经常会遇到图片加载失败出现图片加载失败的默认演示

为了防止这种情况的出现，通常在图片加载失败的时候会显示一张默认的图片，那么大家一般都是怎么解决这种情况，用的什么方法，拿出来分享下，
我只知道一种就是下面这种

<img src="error.jpg" alt="" onerror="this.src='defatule.jpg'" />

Answer 1

img标签当图片不存在时将触发onerror事件，提供几个方案。
1.常规写法

// js
function imgError(image) {
    image.onerror = "";
    image.src = "/images/noimage.gif";
    return true;
}
// html
<img src="image.png" onerror="imgError(this);"/>

2.内联式:

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

3:使用jQuery:

$("img").error(function () {
  $(this).unbind("error").attr("src", "broken.gif");
});

Answer 2

http://orangexc.xyz/2016/05/2...

望采纳

Answer 3

其实无非就是两种情况, 跨域和不跨域.

1. 跨域, 请求的img失败, 没有显示. 显示本地默认的一个图 在onerror中处理

2. 同域, 同域如果目的图片加载不出, errorImg估计也加载不出.当然排除低级错误

也可以js 去预先判断不稳定的服务器下的图片.

function addImg(isrc)
    {
        var Img = new Image();
        Img.src = isrc;
        Img.onload = function ()
        {
              document.body.appendChild(Img);
        }
        Img.onerror = function ()
        {
              console.log("error");
        }
    }

Answer 4

那如果是网速慢 加载慢了 那不就出错了