document.ready和window.onload的区别

一、页面加载完成触发事件：

• ready：表示文档结构已经加载完成（不包含图片等非文字媒体文件）
• onload：表示页面包含图片等文件在内的所有元素都加载完成

二、document.ready

1、使用jQuery时的开头方式：

$(function(){
//do something
})

它等价于：

$(document).ready(function(){
//do something
})
//或者 （jQuery的默认参数是:"document"）
$().ready(function(){
//do something
})

2、作用：在DOM加载完成后就可以对DOM进行操作。
一般情况下一个页面响应加载的顺序是：域名解析---加载html---加载js和css---加载图片等其他信息
document.ready应该在“加载js和css”和“加载图片等其他信息”之间，就可以操作DOM了。

二、document.onload

1、用原生js时，我们通常使用onload事件来处理某些情况：

window.onload = function(){
//do something
}
//或者经常用到的图片
document.getElementById("imgID").onload = function(){
//do something
}

2、作用：在document文档加载完成后就可以对DOM进行操作，document文档包括了加载图片等其他信息。
document.onload就是在页面响应加载顺序中的“加载图片等其他信息”之后，就可以操作DOM了。