window onload 与 img onload事件

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事件。

上一篇:openstack网络(三)


下一篇:openstack网络架构(nova-network/neutron)