php onload,onload事件与ready的区别

好久没写文章了，再来一波，首先上图：

前言

页面加载完成有两种事件：

一是ready，表示文档结构(DOM结构)已经加载完成(不包含图片等非文字媒体文件)，

二是onload，指示页面包含图片等文件在内的所有元素都加载完成。(可以说：ready 在onload 前加载！！！)

我的理解： 一般样式控制的，比如图片大小控制放在onload 里面加载;而：jS事件触发的方法，可以在ready 里面加载;

$(function(){

// do something

});

其实这个就是jq ready()的简写，他等价于：

$(document).ready(function(){

//do something

})

//或者下面这个方法，jQuer的默认参数是：“document”；

$().ready(function(){

//do something

})

body的onload事件与$(document).ready相比

加载多函数问题

原生javascript中函数没有重载，所以会实现覆盖

a)body中声明的onload事件(DOM0级别)会被后面的window.onlad()(DOM0级别)覆盖

window.onload = function(){alert('world');}

b)只能在body中的onload中实现多函数执行

function a(){alert('a');}

function b(){alert('b');}

c)多个window.load()会覆盖(如a)实例)

window.onload = function(){alert('hello');}

window.onload = function(){alert('world');}

在JQuery中你可以利用多个JQuery.Ready()方法，它们会按次序依次执行

代码和内容分离问题

body中的onload不分离

而window.onload()分离以及$(document),ready()可以分离

执行先后顺序不同(最大区别)

$(document).ready()：在DOM结构加载完毕之后执行

window.onload：在所有的文件加载完毕之后执行

$(document).ready():最大的区别是DOM加载完毕之后，不必再去等图片(异步)加载完毕后执行js代码

window.onload用法

function winready(){

document.getElementByIdx_x.('load').style.display='none';

}

window.οnlοad=winready; //或者window.οnlοad=function(){winready();}

jquery用法:

$(document).ready(function(){

$('#load').css('display','none');

})

$(window).load()

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

以下内容会在页面所有内容加载完成后按先后顺序依次执行.

$(window).load(function() {

alert("hello");

});

$(window).load(function() {

alert("hello again");

});

与之对应的unload事件(会在页面关闭时候执行)

$(window).unload(function() {

alert("good bye");

});