专栏首页狂码一生为html页面设置图片加载失败时的默认图片

为html页面设置图片加载失败时的默认图片

方法一:

  通过img标签内的onerror事件来设置

<img src="yes.jpg" onerror="onerror=null;src='http://默认图片地址'" />
<img src="yes.png" onerror=src="http://默认图片地址" alt="">

  以上两种写法任选一种即可

方法二:推荐

  利用error事件捕获来处理(全局判断,动态添加的元素也可以),最好将下面的js写在head部分

document.addEventListener("error", function (e) {
  var elem = e.target;
  if (elem.tagName.toLowerCase() == 'img') {
  		elem.src = "http://默认图片地址";
  }
}, true);

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • PHP缩放并合成图片

    版权声明: 此文为本站源创文章[或由本站编辑从网络整理改编], 转载请备注出处:[ 狂码一生] http://www.sindsun.com/...

    Sindsun
  • CentOS-7下搭建配置SVN服务器

    1、安装svn:     >yum -y install subversion     //svn默认安装目录:/bin/svnserve 2、查看svn版本...

    Sindsun
  • Qt创建及使用动态链接库(一)

    2、显示链接DLL,调用DLL中类对象、成员函数。(通过对象即可实现类成员函数的调用)

    Sindsun
  • ElasticSearch教程(一)—— 安装配置

    访问官网下载页面,下载ElasticSearch。run bin/elastriSearch(linux/mac),bin/elastriSearch.bat(...

    逝兮诚
  • iframe 绕过 微信公众号文章防盗检测

    yangdongnan
  • Python后端技术栈(八)--系统设计

    Breathe. Take care. Stand still for a minute. What you are looking for might jus...

    小闫同学啊
  • 以MicroZed单板为例,Vitis嵌入式软件开发极速入门

    Vitis是Xilinx新推出的统一软件平台,可实现在 Xilinx 所有芯片(包括 FPGA、SoC 和 Versal ACAP)上开发嵌入式软件和加速应用。...

    hankfu
  • PyQT 入门(1):程序基础框架

    http://www.cnblogs.com/answeryi/archive/2012/09/27/2705860.html

    bear_fish
  • 第一章 第一节 postgresql安装与配置

    本次安装环境为Ubuntu18.04 Server,postgresql采用10版本。

    cn華少
  • NIPS 2018四大最佳论文出炉!陈天奇等获奖,7场重磅演讲预告

    NeurIPS 2018终于开始,主会场排满了6500人的座位,旁边还有能容纳1500人的房间。

    新智元

扫码关注云+社区

领取腾讯云代金券