Loading [MathJax]/jax/output/CommonHTML/config.js

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >专栏 >把网站已失效图片改为指定的图片的方法

把网站已失效图片改为指定的图片的方法

原创

作者头像

PHP开发工程师

修改于 2021-05-06 02:28:28

修改于 2021-05-06 02:28:28

79800

代码可运行

举报

文章被收录于专栏：thinkphp+vuethinkphp+vue

运行总次数：0

代码可运行

各位站长平时在分享资源或者教程的时候，难免会带上一些图片给文章增添色彩。

有的人可能会考虑使用图床，但找一个稳定的图床是真心不容易啊！如果图床gg了，网站全是报错，不仅影响seo，对用户也不友好。

今天就给大家介绍简单一串代码解决烦恼：

在HTML5当中img标签有onerror属性，如果图片失效可以替换加载默认图片。

<img src="https://pjax.vip/logo.png" onerror="javascript:this.src=''https://www.baidu.com/logo.png''">

上面这行代码应该不难理解，src代表本身要加载的图片，如果这个图片加载失败，则调用onerror所指定的图片，希望能帮到您！

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

评论

登录后参与评论

暂无评论

编辑精选文章

换一批

万字详解高可用架构设计

Go 开发者必备：Protocol Buffers 入门指南

10分钟带你彻底搞懂分布式链路跟踪

多租户的 4 种常用方案

亿级月活的社交 APP，陌陌如何做到 3 分钟定位故障？

60页PPT全解：DeepSeek系列论文技术要点整理

网页中默认图片的几种解决方式

现在网页中图片随处可见，但避免不了有时会出现图片资源失败的情况，在谷歌浏览器中就会显示这样

桃翁

2018/12/06

2.5K0

万万没想到，一张图片也能引发网站崩溃！

网站服务器压缩用户体验优化

大家好，我是程序员鱼皮。前段时间收到一位朋友的紧急求助，他的声音中透着焦急：“老鱼皮救救我啊，最近我的网站突然变得极其缓慢，有时候甚至完全打不开，你能帮忙看看吗？”

程序员鱼皮

2024/07/10

1740

万万没想到，一张图片也能引发网站崩溃！

HTML img src图片路径不存在，则显示一张默认图片的方法

但是这样很不好看，如果用在文章列表，我们可以给 img 标签设置一个 onerror 属性，可以在 src 路径不存在时显示指定的默认图片。

德顺

2019/11/13

7.5K0

情侣小站增加图片懒加载功能

关于懒加载这个功能，我不是第一次折腾它啦相信也不是最后一次嗯.. 记得之前用香港主机那会，网站访问速度简直不能用慢来形容(128元/年，慢的离谱,在淘宝找到他们家的。通过淘宝客服功能沟通服务都能超叼那种) 避坑 https://www.68145.com/(追艺网络) 然而目前我的访问速度使用后效果并不显著总之，这个教程针对网站速度慢的朋友有帮助

小何.

2023/03/11

6030

图片加载失败替换图片解决方案

https 网络安全 java css

图片加载失败在不同浏览器表现有差异，比如google可能会一片空白、img的宽高是0*0，ie会在图片位置会出现一个碎片图标，火狐会显示一个边框像这样：

全栈程序员站长

2022/09/05

2.9K0

谈谈水印实现的几种方式

canvas https node.js 网络安全 github

日常工作中，经常会遇到很多敏感的数据，为防止数据的泄露，我们要在数据上做一些”包装“。目的就是让那些有心泄露数据的”不法分子“迫于严重的”舆论压力“而放弃不法行为，使之”犯罪未遂“，达到不战而屈人之兵的效果。而在安全部门工作的我们，数据安全的观念早已深入骨髓，每个文字，每张图片，都要留心是否有泄露的风险，怎么防止数据泄露，是我们一直思考的问题。比如图片的水印，就是我们工作过程中经常涉及到的问题。因为本身工作内容就是审核平台的开发，经常有一些风险图片会在审核平台出现，考虑到审核人员的安全意识参差不齐，所以为防止不安全的事情发生，图片增加水印的工作是必须要做的。

@超人

2021/10/12

1.1K0

vue图片加载失败默认图片[通俗易懂]

https java 网络安全

1，img是个比较特殊的标签，和video一样具有被替代性，所有当图片加载成功时，原先定义的伪类会失去作用不提示。

全栈程序员站长

2022/09/05

2.4K0

vue图片加载失败默认图片[通俗易懂]

开箱即用的前端图片压缩方案

文件存储 canvas react javascript java

我们都知道在“寸土寸金”的互联网时代, 速度是第一竞争力, 虽然我们的5G发展已经摇摇领先, 但是也经不住用户在一个网页里传很多“巨无霸”图片, 最终导致的结果就是页面“龟速”打开......

徐小夕

2022/09/27

1.3K0

HTML基本标签使用详解

标签 html input 表单表格

在正式讲解标签使用之前，需要先说明，标签这里只做简单用法说明，如果大家在有疑惑的地方，可以翻到最后有实例练习，结合实例一同食用可能会更加清楚标签的用法。

用户10923276

2024/03/28

1890

图片加载失败占位符[通俗易懂]

java https 网络安全容器

当网络不佳加载图片时会出现加载失败或者延时加载的情况，此时原本的图片位置会显示空白状态，这造成了不好的用户体验，所以我们需要加一个图片占位符。有两种方式可以实现：

全栈程序员站长

2022/09/05

3.2K0

5.25秒变0.023秒：小程序图片优化全攻略

用户体验优化小程序网络微信小程序

最近在公司在写微信小程序，该小程序主要展示一些高清图片，所以图片数量非常多，而且图片尺寸也比较大，导致小程序的加载时间非常长。所以这里记录一下如何减少小程序图片的加载时间。

徐小夕

2024/01/11

6180

5.25秒变0.023秒：小程序图片优化全攻略

h5电商模板_网站模板

css linux seo html 网站

搜索引擎优化，又称为 SEO ，即 Search Engine Optimization 两种优化方式：氪金，优化网页相关信息 SEO 三大标签

全栈程序员站长

2022/11/10

8.4K0

懒就是生产力之图片懒加载

最近负责的项目渐渐的由业务型转向营销型，营销内容越来越多，图片也就多了起来。图片一多起来问题就来了，一上来几十张图片加载起来半天都过去了，咋办？凉拌--懒加载

木子墨

2018/10/25

4610

Fluid -34- 创建自己的常用站点导航页

css hexo https 网站网络安全

我的主题是 fluid，在 themes\fluid\layout 中创建 site-map.ejs 文件

为为为什么

2023/03/10

6680

Fluid -34- 创建自己的常用站点导航页

图片加载失败的正确处理[通俗易懂]

https java 网络安全

对于这样一段代码来讲，如果该图片加载成功，那么界面上会显示图片，如果由于一些原因导致图片加载失败，会出现这样的图标。

全栈程序员站长

2022/08/23

2.6K0

图片加载失败的正确处理[通俗易懂]

图片加载失败后显示默认图片

java https 网络安全

发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/139932.html原文链接：https://javaforall.cn

全栈程序员站长

2022/09/03

3.9K0

img图片加载失败的处理

https java 网络安全

发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/145961.html原文链接：https://javaforall.cn

全栈程序员站长

2022/08/29

2.4K0

【HTML5】html5开篇基础（2）

异常 html5 图像标签布局基础

图像标签注意点： 1.图像标签可以拥有多个属性，必须写在标签名的后面。 2.属性之间不分先后顺序，标签名与属性、属性与属性之间均以空格分开。 3.属性采取键值对的格式，即 key=“value" 的格式，属性 =“属性值”

E绵绵

2024/09/24

3370

【HTML5】html5开篇基础（2）

原生 JS 实现最简单的图片懒加载

懒加载其实就是延迟加载，是一种对网页性能优化可方式，比如当访问一个页面的时候，优先显示可视区域的图片而不一次性加载所有图片，当需要显示的时候再发送图片请求，避免打开网页时加载过多资源。

青梅煮码

2023/03/13

3.2K0

原生 JS 实现最简单的图片懒加载

组件Image和九宫格效果

11.png <Image source={require("./img/2.png")} />

conanma

2022/03/09

1.5K0

相关推荐

网页中默认图片的几种解决方式

更多 >

本文部分代码块支持一键运行，欢迎体验

本文部分代码块支持一键运行，欢迎体验