<img>万一src属性无效（仅使用HTML），有什么方法可以在HTML 标签中呈现默认图像？如果没有，那么解决该问题的轻巧方式是什么？
如果html <img>的src属性无效，是否输入默认图像？
如果您已经创建了动态Web项目并将所需的图像放置在WebContent中，则可以通过在Spring MVC中使用下面提到的代码来访问该图像：
<img src="Refresh.png" alt="Refresh" height="50" width="50">
您还可以创建名为img的文件夹，并将图像放置在img文件夹中，并将该img文件夹放置在WebContent中，然后可以使用以下代码访问图像：
<img src="img/Refresh.png" alt="Refresh" height="50" width="50">
Google将该页面添加到“ image fallback html”关键字，但是由于以上都不对我有帮助，并且我一直在寻找“对IE 9以下的svg fallback支持”，因此我一直进行搜索，结果是：
<img src="base-image.svg" alt="picture" />
<!--[if (lte IE 8)|(!IE)]><image src="fallback-image.png" alt="picture" /><![endif]-->
它可能是题外话，但它解决了我自己的问题，也可能对其他人有帮助。
使用Jquery，您可以执行以下操作：
$(document).ready(function() {
if ($("img").attr("src") != null)
{
if ($("img").attr("src").toString() == "")
{
$("img").attr("src", "images/default.jpg");
}
}
else
{
$("img").attr("src", "images/default.jpg");
}
});
仅限HTML的解决方案，唯一的要求是您知道要插入的图像的大小。由于它background-image用作填充图像，因此不适用于透明图像。
background-image如果给定的图像丢失，我们可以成功地用于链接显示的图像。唯一的问题是图标图像损坏了-我们可以通过插入一个很大的空字符来删除它，从而将内容推到的显示之外img。
img {
background-image: url("http://placehold.it/200x200");
overflow: hidden;
}
img:before {
content: " ";
font-size: 1000px;
}This image is missing:
<img src="a.jpg" style="width: 200px; height: 200px"/><br/>
And is displaying the placeholder仅CSS解决方案（仅适用于Webkit）
img:before {
content: " ";
font-size: 1000px;
background-image: url("http://placehold.it/200x200");
display: block;
width: 200px;
height: 200px;
position: relative;
z-index: 0;
margin-bottom: -16px;
}This image is there:
<img src="http://placehold.it/100x100"/><br/>
This image is missing:
<img src="a.jpg"/><br/>
And is displaying the placeholder<img style="background-image: url(image1), url(image2);"></img> 使用可添加多个图像的背景图像。我的情况是：image1是主图像，它将从某个位置（浏览器执行请求）获得。image2是在加载image1时显示的默认本地图像。如果image1返回任何类型的错误，则用户将看不到任何更改，这对于用户体验将是干净的
您要求提供仅HTML的解决方案...
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Object Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<p>
<object data="http://stackoverflow.com/does-not-exist.png" type="image/png">
<img src="https://cdn.sstatic.net/Img/unified/sprites.svg?v=e5e58ae7df45" alt="Stack Overflow logo and icons and such">
</object>
</p>
</body>
</html>由于第一个图像不存在，因此将显示后备（此网站上使用的sprites *）。如果您使用的是真正的老的浏览器不支持object，它会忽略该标签和使用img标签。有关兼容性，请参见caniuse网站。截至2018年，ie6 +的所有浏览器均广泛支持此元素。
*除非再次更改图片的网址，否则您可能会看到替代文字。
我最近不得不构建一个回退系统，其中包括任意数量的回退图像。这是我使用简单的JavaScript函数完成的方法。
的HTML
的JavaScript
我觉得这是处理许多后备图像的一种非常轻巧的方法。