body中的onload()和window.onload以及$(document).ready()的区别:
1、前两者都表示当页面加载元素(包括图片等信息)完毕后执行的操作,而且两者在各种浏览器中都兼容,而$(document).ready()表示的是JQuery中的一个方法因而只有在支持jQuery的浏览器中才适用,同时该方法是在当页面的dom节点加载完毕后就执行,无需等待页面中的图片等加载完成。
2、当代码中同时存在body中的onload()和window.onload()要注意的 :
a、当JS代码在head中时且window.onload()中方法是匿名时:将会跳过window中的方法。
<html>
<head>
<script type="text/javascript"> alert('a');
window.onload=function () {
alert('b');
} ;
alert('c');
</script>
</head>
<body onload="alert('d');">
</body>
</html>
上面的代码中执行的结果是:a,c,d
b、当JS代码在head中同时window.onload()中方法不是匿名时,这时会对浏览器的不同有差异,在IE8以及IE8以下的版本中会顺序执行JS代码到window.onload()但其后面的将不会被执行(除了定义的方法在其他地方被调用的外),而在IE8以上以及chrome等浏览器中都将会被执行。
<html>
<head>
<script type="text/javascript"> alert('a');
window.onload=fn();
function fn() {
alert('b');
} ;
alert('c');
</script>
</head>
<body onload="alert('d');">
</body>
</html>
由上知当在IE8以及以下的版本中的执行结果为:abd,在其他浏览器中的执行结果为:
a,b,c,d
c、当JS代码在body中时同时window.onload()中的方法不是匿名的时:
<html>
<head>
</head>
<body onload="alert('a');">
<script type="text/javascript"> alert('b');
window.onload=fn();
function fn () {
alert('c');
} ;
alert('d');
</script>
</body>
</html>
上述代码在IE8以及以下版本中的执行结果为:b,c,a在其他浏览器中的执行结果为:b,c,d
d、当JS代码中body中同时window,onload()中的方法是匿名函数时:
<html>
<head>
</head>
<body onload="alert('a');">
<script type="text/javascript"> alert('b');
window.onload=function () {
alert('c');
} ;
alert('d');
</script>
</body>
</html>
上述代码的执行结果为:b,c,d
将JS代码放在body和放在head中的结果不一样这是和文档的加载顺序相关的。