Dom onload和jQuery document ready的区别

116 阅读1分钟

使用如下代码进行测试:

<html>
<script src="jquery_1.7.1.js">
</script>
<script>
$(document).ready(start());
function start() {
 console.log("start here");
 var main = $("#main");
 console.log("length: " + main.length);
 var another = document.getElementById("main");
 var oHeader = document.getElementById("header");
 $("#main").queue('test', function() { console.log("1");});
 $("#main").queue('test', function() { console.log("2");});
 $("#main").queue('test', function() { console.log("3");});
 $("#main").dequeue('test');
 $("#main").dequeue('test');
 $("#main").dequeue('test');
}
</script>
<body id = "main" οnlοad="start();">
<h1 id = "header">hello</h1>
</body>
</html>

首先是jQuery的document.ready 事件触发:

此时document节点下还没有加载body和h1节点, 因此line 9,line11和line 12均返回null. 只有当Dom的onload 事件触发时,body node和h1 node才可见: 要获取更多Jerry的原创文章,请关注公众号"汪子熙":