对jquery的$(function(){})的理解

对jquery的$(function(){})的理解

<script>
	window.onload = function(){
		console.log('执行load')	
	}
	window.onload = function(){
		console.log('执行load1')
	}
	$(function(){
		console.log('This is A')
	})
	$(function(){
		console.log('This is B')
	})
</script>

以上代码的执行结果如下：

从以上结果可以看出:

1. $(function(){})不会被覆盖，而window.onload会被覆盖。
2. $(function(){})在window.onload执行前执行的，在DOM加载完毕后，页面全部内容（如图片等）完全加载完毕前被执行。而window.onload会在页面资源全部加载完毕后才会执行。

DOM文档加载步骤:

1. 解析HTML结构
2. 加载外部的脚本和样式文件
3. 解析并执行脚本代码
4. 执行$(function(){})内对应代码
5. 加载图片等二进制资源
6. 页面加载完毕，执行window.onload