用文本替换损坏的图像[重复]答案

【问题标题】：Replace Broken image with text [duplicate]用文本替换损坏的图像[重复]
【发布时间】：2020-08-30 07:44:47
【问题描述】：

如果链接错误或照片不再可用，是否可以用简单的文字替换照片？

&lt;img id="CurrentPhoto" src="https://upload.wikimedia.org/wikipedia/commons/thumb/0/02/Stack_Overflow_logo.svg/1200px-Stack_Overflow_logo.svg.png" onerror="this.src='https://www.stackoverflowbusiness.com/hubfs/logo-so-white.png'" alt=""&gt;

使用此代码，可以在链接断开的情况下替换图像。但是，我希望我可以插入文本而不是第二张照片。例如，如果第一张照片不可用，则显示文本“例如 Stackoverflow”。

有可能吗？哪位好心的小天使知道如何帮助我？

【问题讨论】：

为什么不直接使用alt 属性？这很简单，也是可访问性的最佳实践。
只有 Alt 可以看到丢失图片的经典图标。

标签： javascript html text replace onerror

【解决方案1】：

我很抱歉，但我不知道如何打开澄清或修改最初的帖子。

我试图更好地解释自己。我想让文本显示没有图像未加载时出现的经典图标。只有文字。

【讨论】：

您可以编辑您的问题并删除此帖子。下面应该有小链接。
谢谢！我谦虚地道歉。我是新来的，我从来没有注意到那些小声音。感谢您的耐心等待

【解决方案2】：

使用 alt 属性是一个很好的解决方案，因为它可以在图像未加载时显示。

Stackoverflow 上已经有一个类似的问题：How to hide image broken Icon using only CSS/HTML?

答案不是公认的答案，但我认为这是用纯 css 做到这一点的一种非常好的方法。

代码很好，如果你想查看来源，还有一个链接：https://bitsofco.de/styling-broken-images/

【讨论】：

谢谢！我试着看看并让你知道
太棒了！如果它解决了您的问题，您可以接受答案。如果您使用其他代码，请分享您自己的解决方案并接受这一点，以便其他发现此问题的人知道如果他们正在寻找类似的解决方案对您的问题有效。