$(document).ready vs $(window).load vs window.onload
原文地址： $(document).ready vs $(window).load vs window.onload
We execute our code when DOM is ready except images.
//call type 1
$(document).ready(function() {
/** work when all HTML loaded except images and DOM is ready **/
// your code
}); //call type 2
$(function() {
/** work when all HTML loaded except images and DOM is ready **/
//your code
}); //call type 3
$(document).on('ready', function(){
/** work when all HTML loaded except images and DOM is ready **/
//your code
}); //call type 4
jQuery(document).ready(function(){
/** work when all HTML loaded except images and DOM is ready **/
//your code
});
It is work when all DOM is ready including images so it is useful when on document load we want to work with images.
$(window).load(function() {
/** this is come when complete page is fully loaded, including all frames, objects and images **/
});
The onload event is a standard event in the DOM, while above two are specific to jQuery . this is also same functionality like $(window).load but window.onload is the built-in JavaScript event.The onload event occurs when an object has been loaded.like if we take a example of image and call onload event in image tag then it will call when image will load .generally we use it in body tag.
In HTML
<element onload="myFunction"></element>
In JS
object.onload=function(){/**your desire code**/};// here object can be window,body and etc
1) Here alert “call on body load” call immediately after body has been loaded
// In HTML
<!-- on body onload call myFunction -->
<body onload="myFunction()"> //In JavaScript
// myFunction() which will call on body load
function myFunction(){
alert("call on body load");
}
2) Here alert “call on image load” call immediately after image has been loaded
// In HTML
<!-- on image onload call myImageFunction() -->
<img src="data:image path src" onload="myImageFunction()"> // // myFunction() which will call on image load
function myImageFunction(){
alert("call on image load");
}
window.onload Examples
The function fires at the end of the document loading process. At this point, all of the objects in the document are in the DOM, and all the images, scripts, links and sub-frames have finished loading.
window.onload = function() {
init();
doSomethingElse();
};
以上です。
随机推荐
- EF Code First教程-02 约定配置
示例: public class Phone { [Key] //主键 public int Id { get; set; } [Required] //不能为空 [MinLength(),MaxLe ...
- 使用dbms_system追踪其它session
dbms_system是内部包,建议在官方指导下使用该包. SQL> desc dbms_system PROCEDURE ADD_PARAMETER_VALUE Argument Name T ...
- 在相同的主机上创建一个duplicate数据库
在相同的主机上创建一个duplicate数据库 source db:dbtest auxiliary db:dupdb duplicate database会自动分配一个新的DBID要确保auxili ...
- iOS-self.layer.shouldRasterize属性
当shouldRasterize设成true时,layer被渲染成一个bitmap,并缓存起来,等下次使用时不会再重新去渲染了.实现圆角本身就是在做颜色混合(blending),如果每次页面出来时都b ...
- Java基础之在窗口中绘图——绘制曲线（CurveApplet 1）
Applet程序. 定义自由曲线的类有两个,其中一个定义二次曲线,另一个定义三次曲线.这些自由曲线是用一系列线段定义的参数化曲线.二次曲线段用方程定义,方程包含独立变量x的平方.三次曲线也用方程定义, ...
- nginx：配置详细说明
一.fastcgi param 详情: fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;#脚本文件请求的路径 fast ...
- 同一个主机上的JVM实例之间通信
hadoop yarn里用了RPC调用.NM里面文件本地化类ContainerLocalizer用RPC心跳方式跟本机的ResourceLocalizationService通信. 用shared m ...
- java collections读书笔记（11) Lists
继续这个系列,好久没学习了,懒惰呀. Set接口,实际上是collection 类别中最简单的一个接口,因为它并没有比Collection 接口增加任何的内容,相对而言,大家可能更喜欢List接口和它 ...
- C++Primer 第十三章
//1.当定义一个类时,我们显示地或隐式地指出在此类型的对象(注意这里是此类型的对象,而不包括此类型的指针)拷贝,移动,赋值,销毁时做什么.一个类通过定义五种特殊的成员函数来控制这些操作:拷贝构造函数 ...
- MySQL编码问题
client 下的default_character_set=utf8; 它是需要的,可是它的作用是干吗的? 它的作用等同执行以下3个命令 SET character_set_client = utf ...