window onload 与 img onload事件

通常，window.onload就是载入完dom之后运行的。

而img就是载入完图片完运行它的onload事件。依据img的src是否载入完毕。

因此。看以下代码：

<!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>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>window onload与img onload</title>

<script type='text/javascript'>

window.onload = function(){

	var img = document.getElementById('img1');

	//var src = img.getAttribute('src');

	//img.setAttribute('src','');

	img.onload = function(){

		alert(1);

	};

	//img.setAttribute('src',src);

};

</script>

</head>

<body>

<img src='6.png' id='img1'/>

</body>

</html>

注：上面的6.png自己找图片替换上。

上面代码将不会弹出1。由于window.onload已经包含图片的onload了。而图片的onload是监听img的src是否载入完毕。去掉凝视就可以弹出1，不可弹出1的可能你的图片找不到。scr没有载入完毕。因此没有弹出1.

ps：img的onload事件也可灵活应用，像一些特殊业务需求的。无法追加window.onload事件等，而考虑採用img的onload事件，如载入一张小图片，做隐藏处理。里面调用onload事件。

window onload 与 img onload事件的更多相关文章

  1. window.load 和$(document).ready() 、window.load和body onload区别

    1.执行时间 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行. $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕.2.编写个数不同 w ...

  2. window.onload 和 body.onload 相互覆盖的本质

    从根源上讲,window.onload和<body onload="alert('test');"> 所绑定的对象都是window ,body是没有onload事件的, ...

  3. window.onload 、body.onload 以及 jQuery 等dom加载完成后执行脚本的区别

    1.关于window.onload 和 body.onload 的区别 当我们将onload 事件写在body元素上时,真正执行的其实是window对象的onload事件.因素HTMl页面中没有win ...

  4. window.onload，<body onload="function()">, document.onreadystatechange, httpRequest.onreadystatechang

    部分内容参考:http://www.aspbc.com/tech/showtech.asp?id=1256 在开发的过程中,经常使用window.onload和body onload两种,很少使用do ...

  5. window.onload，<body onload="function()">, document.onreadystatechange, httpRequest.onreadystatechang 分类： C1_HTML/JS/JQUERY 2014-08-06 16:47 558人阅读 评论(0) 收藏

    部分内容参考:http://www.aspbc.com/tech/showtech.asp?id=1256 在开发的过程中,经常使用window.onload和body onload两种,很少使用do ...

  6. IE attachEvent事件处理程序(事件绑定的函数)的this指向的是window不是执行当前事件的dom元素

    IE attachEvent事件处理程序(事件绑定的函数)的this指向的是window不是执行当前事件的dom元素. attachEvent(type,listener); listener函数中的 ...

  7. window.open('') 火狐，IE事件冒泡处理，点击事件冒泡处理

    window.open('') 火狐,IE事件冒泡处理,点击事件冒泡处理 写PC下拉菜单的时候,hover样式显示下拉菜单,可能会这样写 <li class="xb_li1" ...

  8. window.onload绑定多个事件 —— 两种解决方案

    前言 有些函数,必须在网页加载完毕后执行.比如:涉及DOM操作的. 网页加载完毕时会触发一个onload事件,将函数绑定到这个事件上即可. window.onload = myFunction; 问题 ...

  9. document.ready、window.onload、body.onload的区别

    document的ready事件通常会比window的onload事件先发生,为什么呢? 因为document的ready是在浏览器加载解析并构建完doc文档模型时发生的,而window的onload ...

随机推荐

  1. SSH的简单入门体验（Struts2.1+Spring3.1+Hibernate4.1）- 查询系统（下）

    我们继续吧,SSH最大的优点就是实现的系统的松耦合,能够将后台和前台有机的分离开来. 一.目录结构 一个好的程序要有一个好的开始.我们先来看看整个目录结构吧 主要的是三层架构概念,或者说是mvc的概念 ...

  2. KDJ金叉测试

    # -*- coding: utf-8 -*- import os import pandas as pd # ========== 遍历数据文件夹中所有股票文件的文件名,得到股票代码列表stock_ ...

  3. java两种实现二分查找方式

    二分查找法适用于 升序排列的数组,如果你所要操作的数组不是升序排序的,那么请用排序算法,排序一下. 说明:使用二分查找法相比顺序查找  节约了时间的开销,但是增加了空间使用.因为需要动态记录 起始索引 ...

  4. python的内存管理机制（zz)

    本文转载自:http://www.cnblogs.com/CBDoctor/p/3781078.html 先从较浅的层面来说,Python的内存管理机制可以从三个方面来讲 (1)垃圾回收 (2)引用计 ...

  5. 通过docker info命令，可以了解很多信息

    来个输出吧. Containers: 1 Running: 1 Paused: 0 Stopped: 0 Images: 1 Server Version: 17.03.1-ce Storage Dr ...

  6. mysql TIMESTAMPDIFF

    在MySQL应用时,经常要使用这两个函数TIMESTAMPDIFF和TIMESTAMPADD. 一,TIMESTAMPDIFF 语法: TIMESTAMPDIFF(interval,datetime_ ...

  7. vim 代码片段：通过vundle插件管理器安装ultisnips |centos6.5|vim7.2

    背景:中午醒来,饭都没吃,突然想到要给vim增加个代码片段的功能,因为昨天使用了gedit的代码片段,感觉不错.为什么不直接使用gedit呢?因为我相信把时间投入到vim是不会错的,精通vim就好了. ...

  8. 实现用http上传文件，用ftp下载文件

    1.ftp配置 1.检查安装vsftpd软件 使用如下命令#rpm -qa |grep vsftpd可以检测出是否安装了vsftpd软件, 如果没有安装,使用YUM命令进行安装. 2.启动服务 使用v ...

  9. 洛谷 P1598 垂直柱状图【字符串】

    题目描述 写一个程序从输入文件中去读取四行大写字母(全都是大写的,每行不超过72个字符),然后用柱状图输出每个字符在输入文件中出现的次数.严格地按照输出样例来安排你的输出格式. 输入输出格式 输入格式 ...

  10. GetAdaptersInfo获取网卡配置和Ip地址信息

    一台机器上可能不只有一个网卡,但每一个网卡只有一个MAC地址,而每一个网卡可能配置有多个IP地址:如平常的笔记本电脑中,就会有无线网卡和有线网卡(网线接口)两种:因此,如果要获得本机所有网卡的IP和M ...