关于jquery的load与ready的区别

首先你要搞懂load与ready的区别，你就要先知道网页对于资源的加载步骤：

1. 下载解析html文档结构
2. 加载外部脚本文件与样式文件
3. 解析并执行脚本代码
4. 构造html DOM模型
5. 加载图片等媒体资源
6. 页面加载完毕

load

load事件必须等到网页中所有内容全部加载完毕之后才被执行。即上述的第六步完成后再运行函数。如果一个网页中有大量的图片的话，则就会出现这种情况：网页文档已经呈现出来，但由于网页数据还没有完全加载完毕，导致load事件不能够即时被触发。所以当我们要加载一个特别大的图片时，如果没有在图片标签就限制了图片的大小，而是在load内设置图片大小，就会造成图片先把页面撑开，等到图片全部加载完毕后再改变其大小的问题。这样以来，用户体验就会非常的差。

ready

ready()方法在上述第4步完成后运行，即DOM结构绘制完成之后就绘执行。这样能确保就算有大量的媒体文件没加载出来，JS代码一样可以执行。

$(function(){}) => 即 $(document).ready(function(){})

总结：在没有图片及媒体文件需要加载时，load与ready并无区别，尽量使用ready。