Jquery中$(function(){})

1. 在哪书写js文件

如果我们要执行一段js代码，我们该怎么办呢？

1.我们可以写一个js文件，在js文件里写执行函数，然后再<script src='...'> ... </script>，进行引用；

2.我们可以直接在HTML页面下，插入脚本，同样是<script src='...'> ... </script>，两种方式没什么区别，唯一的区别就是程序的解耦，所以当我们执行的js代码不太多时候，我推荐在HTML页面下直接书写，反则...。

2. $(function(){}); 其实是一个简写，它等同于 jquery 的 $(document).ready(function(){})。

我们知道HTML页面在JavaScript里面有BOM对象和DOM对象，BOM是浏览器对象模型，用来获取或设置浏览器的属性、行为，例如：新建窗口、获取屏幕分辨率、浏览器版本号等。
DOM是文档对象模型，用来获取或设置文档中标签的属性，例如获取或者设置input表单的value值。
BOM的内容不多，主要还是DOM。

同样的，我们可以用Jquery来操作BOM和DOM，这儿就引出了本文主旨：$(document).ready(function(){})

现在我们开始执行js文件，但这样有个问题，就是对于某些浏览器来说，如果其中的代码涉及到某个 dom 节点的位置在这段代码之后的话就可能会失败。原因是代码在 html 文档的前面，浏览器读到它的时候就执行了，而 dom 节点在它后面浏览器还没读取到呢，所以不知道怎样去操作这个节点，于是报错了。你会说为什么不等到所有节点都读取完了再回头执行 js 代码呢？关键是有些代码就是想在页面出来一部分时就执行了啊。所以对于那些在页面读取完才执行的代码通常会放到 onload 中去。但 onload 又有自己的问题，比如 onload 的 window 的还有 body 的，执行的时机很是不好确定。于是 jquery 推出了 $(document).ready(function(){}) 它的设计目标有以下几个(可看作 jquery 的 ready 函数与 js 的 onload 的区别)：

1.执行时间

window.onload 必须等到页面内包括图片的所有元素加载完毕后才能执行；

$(document).ready() 是 dom 结构绘制完毕后就执行，不必等到加载完毕。

2.编写个数不同

window.onload不能同时编写多个，如果有多个window.onload方法，只会执行一个

$(document).ready()可以同时编写多个，并且都可以得到执行。

特别是第二点，大大的方便了代码初始化的分离操作（解耦），确实是 jquery 对开发人员的巨大贡献。否则各个代码块中都要自己想办法在初始化函数中加入自己的那一部分，会相当的混乱。

另外传统是 onload 是这样写的：

而我们提到的 $(document).ready() 是 dom 解析完成后，不用等待图片等资源加载即可开始执行了，那么要等待的话怎么办呢？难道要写上面那种传统的代码吗？当然不是，jquery 中是使用 $(window).load(function()。例如：

$(window).load(function() {alert("hello,我是jQuery!");});

而且这个函数同样可以写多个，它们之间同样不会覆盖。会依次顺序执行