JS对img标签进行优化使用onerror显示默认图像

对于网站图像的不显示有很多原因，网络问题，文件本身问题，文件ＵＲＬ问题等，而当图像加载失败时会触发onerror这个事件，我们利用这点，可以有效的避免图像加载失败的尴尬！

js代码


代码如下:

//图像加载出错时的处理
function errorImg(img) {
img.src = "http://static.xuexiba.com/uploadfile//UserInfo/Avatar/201403/1303992393385832875324.jpg";
img.onerror = null;
}

html代码


代码如下:

<img width="32" height="32" src="1.jpg" onerror="errorImg(this)" />

页面效果

赞 (0)

相关推荐

  • js 优化次数过多的循环 考虑到性能问题

    假设要生成一千万个随机数,常规的做法如下: 复制代码 代码如下: var numbers = []; for (var i = 0; i < 10000000; i++) { numbers.push(Math.random()); } 然而,在IE下执行这段代码时,却弹出了一个窗口提示用户是否停止这段脚本.出现这种情况,首先想到的是优化循环体.但明显地,循环体很简单,没什么优化的余地.即使把循环体清空,提示仍然存在.于是,我得出了一个结论:在IE下,一旦循环次数超过了某个特定值,就会弹出停止脚

  • Uglifyjs(JS代码优化工具)入门 安装使用

    Uglifyjs(JS代码优化工具)入门 安装使用

    你也可以尝试一下在线版的Uglifyjs: http://sweet.fengyin.name/ 需要先安装node,进入命令行,查看node,npm是否正确安装. 接下来安装UglifyJS,命令如:npm install uglify-js -g 最后别忘了把node和npm添加到环境变量中,我的分别是 C:\Program Files (x86)\nodejs\; C:\Users\taozhou\AppData\Roaming\npm; 现在就可以使用uglifyjs就行压缩了,如 ug

  • JavaScript优化以及前段开发小技巧

    JavaScript优化以及前段开发小技巧

    一.网络优化 YSlow有23条规则,中文可以参考这里.这几十条规则最主要是在做消除或减少不必要的网络延迟,将需要传输的数据压缩至最少. 1)合并压缩CSS.JavaScript.图片,静态资源CDN缓存 通过构建工具Gulp,可以在开发的时候就将合并压缩的事情一起做掉. 之所以要做合并压缩是因为:HTTP 1.x不允许一个连接上的多个响应数据交错到达(多路复用),因而一个响应必须完全返回后,下一个响应才会开始传输. 也就是说即使客户端同时发送了两个请求,而且CSS资源先准备就绪,服务器也会先发

  • javascript教程:关于if简写语句优化的方法

    UglifyJS是一个对javascript进行压缩和美化的工具,在它的文档说明中,我看到了几种关于if语句优化的方法.尽管我还没使用它去做一些尝试性的测试,但从这里可以看到它的确对js作了美化的工作.也许有人认为if语句就那么简单,能优化到什么程度?但是看看以下的几种方式,你也许会改变看法. 一.使用常见的三元操作符 if (foo) bar(); else baz(); ==> foo?bar():baz();if (!foo) bar(); else baz(); ==> foo?baz

  • JavaScript也谈内存优化

    JavaScript也谈内存优化

    相对C/C++ 而言,我们所用的JavaScript 在内存这一方面的处理已经让我们在开发中更注重业务逻辑的编写.但是随着业务的不断复杂化,单页面应用.移动HTML5 应用和Node.js 程序等等的发展,JavaScript 中的内存问题所导致的卡顿.内存溢出等现象也变得不再陌生. 这篇文章将从JavaScript 的语言层面进行内存的使用和优化的探讨.从大家熟悉或略有耳闻的方面,到大家大多数时候不会注意到的地方,我们一一进行剖析. 1. 语言层面的内存管理 1.1 作用域 作用域(scope

  • js性能优化 如何更快速加载你的JavaScript页面

    确保代码尽量简洁 不要什么都依赖JavaScript.不要编写重复性的脚本.要把JavaScript当作糖果工具,只是起到美化作用.别给你的网站添加大量的JavaScript代码.只有必要的时候用一下.只有确实能改善用户体验的时候用一下. 尽量减少DOM访问 使用JavaScript访问DOM元素很容易,代码更容易阅读,但是速度很慢.下面介绍几个要点:限制使用JavaScript来修饰网页布局,把针对访问元素的引用缓存起来.有时,当你的网站依赖大量的DOM改动时,就应该考虑限制你的标记.这是改用

  • nodejs的10个性能优化技巧

    nodejs的10个性能优化技巧

    下面是我们使用Node.js时遵循的10个性能规则: 1. 避免使用同步代码 在设计上,Node.js是单线程的.为了能让一个单线程处理许多并发的请求,你可以永远不要让线程等待阻塞,同步或长时间运行的操作.Node.js的一个显著特征是:它从上到下的设计和实现都是为了实现异步.这让它非常适合用于事件型程序. 不幸的是,还是有可能会发生同步/阻塞的调用.例如,许多文件系统操作同时拥有同步和异步的版本,比如writeFile和writeFileSync.即使你用代码来控制同步方法,但还是有可能不注意

  • js中if语句的几种优化代码写法

    尽管我还没使用它去做一些尝试性的测试,但从这里可以看到它的确对js作了美化的工作.也许有人认为if语句就那么简单,能优化到什么程度?但是看看以下的几种方式,你也许会改变看法. 一.使用常见的三元操作符 复制代码 代码如下: if (foo) bar(); else baz(); ==> foo?bar():baz(); if (!foo) bar(); else baz(); ==> foo?baz():bar(); if (foo) return bar(); else return baz

  • Extjs优化(二)Form表单提交通用实现

    复制代码 代码如下: /** * 提交表单 */ function $postForm(a) { if (a.formPanel.getForm().isValid()) { var b = a.scope ? a.scope: this; a.formPanel.getForm().submit({ scope: b, url: a.url, method: "post", params: a.params, waitMsg: "正在提交数据...", succe

  • JS对img标签进行优化使用onerror显示默认图像

    JS对img标签进行优化使用onerror显示默认图像

    对于网站图像的不显示有很多原因,网络问题,文件本身问题,文件URL问题等,而当图像加载失败时会触发onerror这个事件,我们利用这点,可以有效的避免图像加载失败的尴尬! js代码 复制代码 代码如下: //图像加载出错时的处理 function errorImg(img) { img.src = "http://static.xuexiba.com/uploadfile//UserInfo/Avatar/201403/1303992393385832875324.jpg"; img.

  • 浅谈JS对html标签的属性的干预以及对CSS样式表属性的干预

    -任何标签的任何属性都可以修改! -HTML里是怎么写, JS就怎么写 以下是一段js 作用于 css 的 href的 代码 <link id="l1" rel="stylesheet" type="text/css" href="css1.css" rel="external nofollow" /> <script> function skin1() { var oL=docum

  • js实现a标签超链接提交form表单的方法

    本文实例讲述了js实现a标签超链接提交form表单的方法.分享给大家供大家参考.具体实现方法如下: <form action="/home/search" method="get" id="search_form"> <div class="searchBox png" id="searchBox"> <input type="text" id="

  • Jquery和Js获得元素标签名称的方法总结

    Jquery 和 Javascript 获得元素标签名称是通过tagName的属性获取的. 这里提供高版本 Jquery的获取元素标签名称的方法: 1.$( this ).get(0).tagName 2.$( this )[0].tagName 3.$( this ).prop("tagName") 4.$( this ).prop("nodeName") 以上就是小编为大家带来的Jquery和Js获得元素标签名称的方法总结全部内容了,希望大家多多支持我们~

  • JS实现HTML标签转义及反转义

    简单说一下业务场景,前台用户通过input输入内容,在离开焦点时,将内容在div中显示. 这时遇到一个问题,如果用户输入了html标签,则在div显示中,标签被解析. 由于是纯前端操作,不涉及后端,因此需要通过js对输入内容进行转义. 这里提供一个非常简单有效的转义方案,利用了innerHTML和innerText 注:火狐不支持innerText,需要使用 textContent 属性,而IE早期版本不支持此属性,为了同时兼容IE及火狐,需要进行判断操作. 因为innerText(textCo

  • js改变embed标签src值的方法

    本文实例讲述了js改变embed标签src值的方法.分享给大家供大家参考.具体分析如下: 今天有一需求,一堆视频,一堆链接,点击相关的链接,在本页打开相关的视频. 第一想法,很简单么,直接把src值改成点击的那个的href值就可以了. 试了下,发现这样不行,视频该怎么放还是怎么放,永远是刚打开那个. 第二想法,给embed外面加个标签,把里面内容清空,再写进去,这样总可以了吧. 试了下,和上面一样,依旧不行. 又试了许多类似方法,还是不行. 最后,想的,把embed标签隐藏(display:no

  • JS创建Tag标签的方法详解

    JS创建Tag标签的方法详解

    本文实例讲述了JS创建Tag标签的方法.分享给大家供大家参考,具体如下: 一 . 创建标签其原理就是 创建一个节点: var x = document.createElement("TagName") 赋予节点样式: x.setAttribute("class",类名) 对节点进行赋值: x.innerHTML = 内容 //赋值 添加节点到父元素 要添加到的元素.appendChild(x); 二. 样式图: 三. 主要代码流程: HTML部分: <div

  • Asp.net 后台添加CSS、JS、Meta标签的方法

    下面是从Asp.net 后台添加CSS.JS.Meta标签的写法,我们这里写成函数方便以后使用.如果函数放在页面类中, Page参数也可以不要. 首先导入命名空间 using System.Web.UI.HtmlControls; 复制代码 代码如下: /// /// 添加JS脚本链接 /// /// 页面 /// 路径 public void AddJS(System.Web.UI.Page page, string url) { HtmlGenericControl jsControl =

  • js过滤HTML标签完整实例

    本文实例讲述了js过滤HTML标签的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head&

  • JS中script标签defer和async属性的区别详解

    JS中script标签defer和async属性的区别详解

    向html页面中插入javascript代码的主要方法就是通过script标签.其中包括两种形式,第一种直接在script标签之间插入js代码,第二种即是通过src属性引入外部js文件.由于解释器在解析执行js代码期间会阻塞页面其余部分的渲染,对于存在大量js代码的页面来说会导致浏览器出现长时间的空白和延迟,为了避免这个问题,建议把全部的js引用放在</body>标签之前. script标签存在两个属性,defer和async,因此script标签的使用分为三种情况: 1.<script

随机推荐