页面加载完成之后执行js函数

中的onload / window.onload事件,与jQuery的$().ready(function(){}) / (function(){}) 方式比较: 

1.执行时机

window.onload方法是在网页中的所有的元素(包括元素的所有关联文件：图片、音视频、flash等)都完全加载到浏览器之后才执行。如果页面的这些内容很多会让用户等待很长时间。

jQuery中的$(document).ready()方法注册的事件，只要DOM完全就绪，就可以调用，比如图片只要标签完成，不用等这个图片加载完成，就可以设置图片的宽高的属性或样式等。

可以说：ready 在onload 前加载。

 

2.函数绑定

window.onload一次只能保存对一个函数的引用，多次绑定函数只会覆盖前面的函数。

或者

 

在JQuery中可以利用多个JQuery.Ready()方法，注册不同的事件处理程序，它们会按次序依次执行。

function one(){  
    alert("one");  
}  
function two(){  
    alert("two");  
}  
window.onload = two ;  
window.onload = one ;  
// 上面的代码运行后，会弹出“one”。

$(document).ready(function(){  
    one();  
});  
$(document).ready(function(){  
    two();  
});  
// 上面的代码运行后，会分别弹出“one”和“two”。

 

JQuery中的$(window).load()方法：

这个方法会等到页面所有内容加载完毕后才会触发，并且同时又没有OnLoad事件的弊端.

// 上面的代码会在页面所有内容加载完成后按先后顺序依次执行.

// 与之对应的Unload方法,会在页面关闭时触发
$(window).unload(function() {
    alert("bye bye");
});

 

建议使用方式：样式控制的，比如图片大小控制，使用$(window).load();

              jS事件触发的方法，可以在$(document).ready()里面加载。

 

使用jQuery，页面加载完成之后执行js函数的几种写法： 

$(function(){

});

$(document).ready(function(){

});

// jQuery的默认参数是：“document”；
$().ready(function(){

});