JS 和JQuery的页面加载事件

一、在写JQuery的过程中，一定少不了使用页面加载事件，而在使用起来的时候总是忘记，今天正好来总结一下也方便以后忘的时候回头看看：

1、DOM页面加载事件：

window.onload=function(){
	console.log("我是Dom页面加载事件");
}

说明：页面全部加载完毕才触发（标签、文字、图片、引入的文件），即所有页面元素加载完毕，并且引用的外部资源下载完毕后才触发，会引起覆盖问题，onload不仅仅可以应用于window，也可以用于其它的一些标签。

2、jQuery的页面加载事件：（第一种）

$(window).load(function(){
	console.log("我是jQuery的页面加载事件");
})

说明：jQuery中第一种页面加载事件，加载所有的内容。

3、jQuery的页面加载事件：（第二种）

$(document).ready(function(){
	console.log("jQuery的页面加载事件");
})

说明：比上面的快，页面中的基本的元素加载后就触发。

4、jQuery的页面加载事件：（第三种）

jQuery(function(){
	console.log("jQuery的页面加载事件");
})
//另一种写法：
$(function(){
	console.log("jQuery的页面加载事件");
})

说明：页面的基本元素加载后就触发。

二、两者区别的简单说明：

1、表达的意思不同：

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

2、应用场景不同：

• Dom Load是在整个document文档（包括了加载图片等其他信息）加载完成后就可以直接对dom进行操作，比如一张图片要等这个图标加载完成之后才能设置图片的宽高的属性或样式。
• Dom ready是在dom加载完成斥候可以直接对dom进行操作，比如一张图片只要<img>标签加载完成，不用等这个图片加载完成就可以设置图片的宽高属性或样式。

你要去做一个大人，不要回头，不要难过。

“我真的很喜欢你，像风走了八千里，不问归期。”