HTML如果图片未找到

21 浏览
0 Comments

HTML如果图片未找到

我在一个HTML页面上有一张图片:\n

Smiley face

\n如果服务器上找不到该图片,它会显示一个丑陋的空白方块。\n我想让它在找不到图片时显示空白或者我确定服务器上有的其他默认图片。\n如何实现这个功能?

0
0 Comments

当图片无法加载时,通常会显示一个默认的图标或者一个代替的文本。然而,有时候我们希望在图片无法加载时不显示任何内容。这个问题的出现可能是因为我们希望在图片无法加载时不显示任何内容,但是HTML默认的行为是显示一个代替的文本或者图标。

为了解决这个问题,我们可以使用onerror属性来替换Robby Shaw的解决方案中的函数,将其修改为"this.remove()"。这样,当图片无法加载时,就会直接移除掉这个img元素,从而不显示任何内容。

下面是一个示例代码:

1
2

在这个示例中,第一个img元素的onerror属性为空,所以当图片无法加载时,会显示一个代替的文本。而第二个img元素的onerror属性被修改为"this.remove()",所以当图片无法加载时,这个img元素会被直接移除掉,不显示任何内容。

通过使用onerror属性并修改其对应的函数,我们可以实现在图片无法加载时不显示任何内容的效果。这种方法可以让页面更加简洁和清晰,避免了因为图片无法加载而导致的不必要的显示。

0
0 Comments

当网页中的图片无法加载时,我们可以使用HTML来设置一个备用图片。然而,在某些情况下,这种方法可能会出现问题。

在上述讨论中,有人建议使用以下代码来解决这个问题:


   

通过这种方法,我们在``标签中设置了首选图片的URL,然后在``标签中设置了备用图片的URL。这样,如果首选图片无法加载,备用图片将会显示。

但是,有人指出这种方法在IE11浏览器中不起作用,因为IE11不支持这种写法。另外,还某些情况下在``标签中使用``标签是不被允许的。

为了解决这个问题,有人建议将代码中的图片顺序进行交换,即将首选图片的URL放在``标签中,将备用图片的URL放在``标签中。这样,当首选图片无法加载时,备用图片将会显示。

当网页中的图片无法加载时,我们可以使用``和``标签结合的方式来设置一个备用图片。然而,需要注意的是,这种方法在IE11浏览器中可能不起作用,因为IE11不支持在``标签中使用``标签。为了解决这个问题,我们可以将代码中的图片顺序进行交换。

0
0 Comments

当网页中的图片无法加载时,我们可以通过添加onerror属性来解决这个问题。具体的解决方法如下:


通过以上代码,我们可以看到onerror属性被用来监测图片加载错误事件。当图片无法加载时,onerror会触发,然后我们可以在onerror中编写代码来处理这个错误。在这个例子中,我们使用了this.onerror=null;来避免无限循环,并且将图片的src属性设置为默认图片'Default.jpg'

上述方法是解决这个问题的最佳方式。通过更改图片文件名,我们可以自行尝试解决问题。同时,搭配使用有用的alt属性,这是一个很好的解决方法。

需要注意的是,如果'Default.jpg'也无法加载,我们会陷入无限循环。为了避免这种情况,我们可以添加一个判断if (this.src != 'Default.jpg')来进行检查。

另外,对于使用React的开发者,可以参考stackoverflow.com/questions/34097560/…来解决类似问题。

需要注意的是,onerror属性已被标记为过时和不推荐使用,并且不支持IE11。对于需要商业支持的项目,可以参考caniuse.com/mdn-html_elements_img_onerror获取更多相关信息。

0