img 图片找不到时,设置显示默认图片

article/2025/8/27 19:09:48

最开始的 img

<img src="image/people.png" style="width: 100px;height: 100px;">
<img src="image/default.png" style="width: 100px;height: 100px;">

图片找不到时,界面上会显示图片裂开了

<img src="image/people1.png" style="width: 100px;height: 100px;">

image-20210706141917308


这时候,我们想避免这种情况,当图片找不到时,显示一张默认图片

<img src="image/people1.png" onerror="this.src='image/default.png';" style="width: 100px;height: 100px;">

可以看到,图片加载出错时,会调用 onerror,将图片的 src 设置成默认图片的 src 。


图片能找到时,也能够正常显示

<img src="image/people.png" onerror="this.src='image/default.png';" style="width: 100px;height: 100px;">
image-20210706142500802

但是当图片加载出问题,默认图片也出问题时,会死循环

<img src="image/people1.png" onerror="this.src='image/default1.png';" style="width: 100px;height: 100px;">
image-20210706142828055

更改 onerror 设置即可解决死循环问题

<img src="image/people1.png" onerror="this.src='image/default1.png';this.οnerrοr=null;" style="width: 100px;height: 100px;">
image-20210706143431510

所以,最终的方法就是

<img src="图片的url" onerror="this.src='默认图片的url';this.οnerrοr=null;">


http://chatgpt.dhexx.cn/article/axa5iaiI.shtml

相关文章

vue中设置显示默认图片

有时候后台返回的图片格式不对时, 我们需要在img中设置默认图片,例如这种: 最后一张图片显示的是默认图片, 写法如下: 转载于:https://www.cnblogs.com/Shysun/p/9786680.html

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

原文https://segmentfault.com/a/1190000016855234 现在网页中图片随处可见&#xff0c;但避免不了有时会出现图片资源失败的情况&#xff0c;在谷歌浏览器中就会显示这样 <img src"logo.jpg" alt"logo"> 这里的 alt属性是为了当图片加载失败时告诉…

数据库-SQL语言

一、表 1.1创建表 语法格式&#xff1a; CREATE TABLE <表名> ( <列名><数据类型>[列级完整性约束条件] [&#xff0c;<列名><数据类型>[列级完整性约束条件]]… [&#xff0c;<表级完整性约束条件>] )&#xff1b; 注&#xff1a;[ ]…

数据库语言SQL

数据库语言SQL SQL的发展 1974年&#xff0c;由Boyce和Chamberlin提出 1975~1979&#xff0c;IBM San Jose Research Lab的关系数据库管理系统原型System R实施了这种语言 SQL-86是第一个SQL标准 SQL-89、SQL-92(SQL2)、SQL-99(SQL3) 非过程化语言 SQL语言进行数据库操作…

MySQL数据库语言一、DDL

&#x1f618;作者简介&#xff1a;正在努力的99年打工人。 &#x1f44a;宣言&#xff1a;人生就是B&#xff08;birth&#xff09;和D&#xff08;death&#xff09;之间的C&#xff08;choise&#xff09;&#xff0c;做好每一个选择。 &#x1f64f;创作不易&#xff0c;动…

数据库系统之sql语言

查询语言(query language)是用户用来从数据库中请求获取信息的语言。这些语言通常比标准的程序设计语言层次更高。查询语言可以分为过程化的和非过程化的。在过程化语言(procedural language)中&#xff0c;用户指导系统对数据库执行一系列操作以计算出所需结果。在非过程化语言…

一文读懂数据库语言

数据库系统提供数据定义语言&#xff08;Data-Definition Language&#xff0c;DDL&#xff09;来定义数据库模式&#xff0c;并提供数据操纵语言&#xff08;Data-Manipulation Language&#xff0c;DML&#xff09;来表达数据库的查询和更新。而实际上&#xff0c;数据定义和…

数据库+SQL语言

文章目录 数据库相关概念MySQL数据模型关系型数据库 SQL通用语法 SQL语句全解DDLDMLDQL基础查询条件查询排序查询分组查询分页查询 约束外键约束 数据库设计软件研发步骤数据库设计理念和步骤表关系多表查询事务 数据库相关概念 数据库&#xff1a;存储和管理数据的仓库&#x…

又一门国产数据库语言诞生了,比SQL还好用

一、数据库语言的目标 1.1 数据库是做什么的 数据库这个软件&#xff0c;名字中有个“库”字&#xff0c;会让人觉得它主要是为了存储的。其实不然&#xff0c;数据库实现的重要功能有两条&#xff1a;计算、事务&#xff01;也就是我们常说的OLAP和OLTP&#xff0c;数据库的…

数据库标准数据语言SQL——总结

数据库标准数据语言SQL SQL(Structured Query Language),结构化查询语言 1. 数据查询——select 2. 数据操纵——create,drop,alter 3. 数据定义——insert,update,delete 4. 数据控制——grant,revoke 1数据定义 1. 模式的定义删除 2. 基本表的定义、删除与修改 列级完整…

【数据库】SQL语言

目录 一、SQL语言概述 1、特点 2、SQL功能 3、SQL支持数据库系统三级模式 二、数据定义语言&#xff08;DDL&#xff09; 1、模式 2、基本表 3、视图 4、索引 三、数据查询语言&#xff08;DQL&#xff09; 1、单表查询 2、连接查询 3、嵌套查询 4、集合查询 5、…

数据库语言-SQL

数据库语言&#xff0d;SQL 一、概述二、利用SQL建立数据库1、创建Database2、创建Table3、追加元组 三、利用SQL进行简单查询1、单表查询2、检索条件之去重复记录3、检索结果之排序4、模糊查询 四、利用SQL语言进行多表联合查询1、θ-连接之等值连接2、表更名与表别名3、θ-连…

数据库SQL语言

SQL语言基础 大家好&#xff0c;我是大黄。这次我来简单带你们了解一下数据库技术中必不可少的一项——SQL语言。 SQL&#xff0c;英文是Structured Query Language&#xff0c;直面翻译就是结构化疑问语言。所以说明这个语言是有一定的结构的&#xff0c;所以基础阶段不会太困…

数据库语言

DDL语言 其语句包括动词CREATE,ALTER和DROP。在数据库中创建新表或修改、删除表&#xff08;CREATE TABLE 或 DROP TABLE&#xff09;为表加入索引等。 mysql是一个关系型数据库&#xff0c;库里面包含若干个表&#xff0c;而每一张表都是由行和列组成。 1.关于数据库操作的命…

数据库基础语言

目录 数据库与表的概念 如何操作数据库 数据库连接方式 SQL分类 DDL数据定义语言 DML 数据操作语言 数据库常用数据类型 约束条件 主键约束(PRIMARY KEY) 具有主键约束的字段同时可以使用自增来让DBMS自行对其值进行维护 非空约束(NOT NULL) 唯一性约束(UNIQUE) D…

MySQL-SQL语言

文章目录 SQL语法要求&#xff1a;1、DDL1.1、数据库操作(1) 查询当前数据库(2) 查询当前数据库(3) 创建数据库(4) 创建一个itheima数据库&#xff0c;并且指定字符集(5) 删除数据库(6) 切换数据库 1.2、表操作1.2.1、表的基本操作(1) 查询当前数据库所有表(2) 查看指定表结构(…

只知道SQL数据库?又一国产数据库语言诞生了

一、为什么学习数据库&#xff1f; 学习数据库&#xff0c;你肯定需要先了解它&#xff0c;这样你才知道你为什么要学习它&#xff0c;数据库除了SQL还有一些别的数据库&#xff0c;了解它们的作用&#xff0c;可以在不同的场景选择最符合的一个数据库。 1.1 什么是数据库&am…

比SQL还好用,又一门国产数据库语言诞生了

目录 一、数据库语言的目标1、要说清这个目标&#xff0c;先要理解数据库是做什么的。2、什么样的计算体系才算好呢&#xff1f; 二、SQL为什么不行1、先看写着简单的问题2、为什么 SQL 不行呢&#xff1f;3、再看跑不快的原因4、我们再做个类比&#xff1a; 三、SPL为什么能行…

MySQL数据库——SQL语言

文章目录 MySQL数据库——SQL语言前言一、数据定义语言&#xff08;DDL&#xff09;二、数据操纵语言&#xff08;DML&#xff09;三、事务控制语言&#xff08;TCL&#xff09;四、数据查询语言&#xff08;DQL&#xff09;1.select/for 基本查询语句2.给列起别名&#xff08;…

写着简单跑得又快的数据库语言 SPL

数据库语言的目标 要说清这个目标&#xff0c;先要理解数据库是做什么的。 数据库这个软件&#xff0c;名字中有个“库”字&#xff0c;会让人觉得它主要是为了存储的。其实不然&#xff0c;数据库实现的重要功能有两条&#xff1a;计算、事务&#xff01;也就是我们常说的 OLA…