给window.onload事件赋不同的参数,执行顺序不一样哦!

给window.onload事件赋不同的参数,执行顺序不一样哦!

这几天敲例子老看到window.onload,有意思的是,每次赋值不同,界面执行函数显示顺序不一样,为什么呢?


一、现象


1 先弹出框——window.onload成了一个普通变量


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
<html>  
	<head>  
		<title>Untitled</title>  
			<script type="text/javascript">  

				function ShowMessage()  
				{  alert("true"); }  
				function AlertMessage()
				{  alert("again"); } 
				window.onload=ShowMessage();
				window.onload=AlertMessage();   

			</script>  

	</head>  
	<body>  当你看到true时看不到我 </body>  

</html>  

 

当你看到true的弹出框的时候,你肯定没有看到“当你看到true时看不到我”,说明页面还没有载入完就已经开始执行js了。

PS这样可以同时加载多个函数,只是界面出来的晚。


2 —— 后弹出框——window.onload为事件

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
<html>  
	<head>  
		<title>Untitled</title>  
			<script type="text/javascript">  
				function ShowMessage()  
					{  alert("true");  } 
				function AlertMessage()
					{alert("again");} 
				window.onload=function(){ShowMessage();}
				window.onload=function(){AlertMessage();}  
			</script>  
	</head> 
	<body>  你看到true时就看到我了  </body>  
</html>  

当你看到弹出框的时候,你也会看到“你看到弹出框时就看到我了”,这个才是真正的页面载入完才触发。但是后一个函数覆盖前一个函数。

PS:该方法使用匿名函数执行,这种形式不可以同时加载多个函数,需要变形:

window.onload=function()

{

    ShowMessage();AlertMessage();

}


二、结论

window.onload必须是赋值为function类型的时候才能够在页面加载完成时被调用其他情况下,就会覆盖成一个普通的全局变量了。

functionShowMessage()  

{  alert("true"); }  

window.onload=ShowMessage();

ShowMessage这个方法执行过后的返回值是undefinedwindow.onload=ShowMessage();相当于执行:ShowMessage();window.onload=undefined;这两句。function对象如果只是赋值,不能够带括号的,你只需要:window.onload=ShowMessage;这样就可以了。带括号表示先执行function,然后将执行结果赋值。





给window.onload事件赋不同的参数,执行顺序不一样哦!

上一篇:swagger 在线API文档


下一篇:windows环境下安装虚拟机