jQuery窗体加载事件

方法一：

$(function(){
  $('#box').click(function(){
      alert("haha");
   })
})

方法二：

$(document).ready(function(){
    //省略代码
  })

方法三：

window.onload = function(){
   $('box').click(function(){
        //省略代码
    })
}

方法三即window.onload要等到整个窗口加载完成之后才能出发执行，这就意味着不仅要等到页面的DOM tree加载完成，而且要求所有的外部图片和资源全部加载完毕，才能出发该事件。如果外部资源，例如图片需要很长事件来加载，会让用户有JS效果失效的感觉。

但是 jQuery的方法
“`
$(document).ready(function(){
})

仅仅只需要加载所有的DOM结构之后就可以触发执行，在浏览器把所有的HTML放入DOM tree之前就开始执行JS效果。包括在加载的图片和 资源之前。
这种方式有一种简写的方式：


$(function(){
//此处省略代码
})

注意:
由于在$(document).ready()方法内注册事件，只要DOM就绪就会执行，因此很有可能元素的关联文件还未加载完毕。例如与图片有关的HTML下载完毕，并且已经解析为DOM树，但很有可能图片还未加载完毕，所以例如图片的高度和宽度属性此时不一定有效。要解决这个问题，可以使用jQuery中另一个关于页面加载的方法——load()。load()方法会在元素的onload事件中邦洞一个处理函数，如果处理函数绑定给window对象，则会在所有的内容(包括：窗口，框架，对象，和图片)加载完毕后触发，如果处理函数绑定在元素上，则会在元素加载完后触发。


$(window).load(function(){
//编写代码
})
//相当于下面的JavaScript代码
window.onload = function(){
//编写代码
}

“`