window.onload 和doucument.ready执行顺序
浏览器渲染时 首先解析DOM结构 (同时在发送请求 去请求其他资源 比如图片 视频 等 ) DOM结构解析完毕 这个时候jQuery看准时机在这里添加了监听 所以Ready方法执行很早,可能会引起其他插件没有加载而在ready(handler)中使用引发错误,其后渲染图片 样式 计算页面布局等 这一块相对的耗时比较长,全部结束后出发了window.onload事件
<html>
<head>
<meta charset="utf-8">
<title>demo</title>
</head>
<body>
</body>
<script src="jquery.js"></script>
<script>
window.onload = function () {
alert('onload');
};
$(document).ready(function(){
alert('ready');
});
</script>
</html>
这个代码可以看出先执行ready,在执行window.onload事件
<html> <head> <meta charset="utf-8"> <title>demo</title> </head> <body> </body> <script src="jquery.js"></script> <script> var sayHi1; var sayHi1 = function(){ alert("sayHi1"); } sayHi1(); $(document).ready(function(){ var sayHi = function(){ alert("kaishi "); } sayHi(); }); </script> </html>
这个代码是先弹出sayHi1,再弹出kaishi