$(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();
};
以上です。
随机推荐
- 在 virtualbox 的 centos7 虚拟机中安装增强工具
在 virtualbox 的 centos7 虚拟机中安装增强工具 centos7 刚刚安装完成时,直接安装 virtualbox 增强工具会出错,需要先把 gcc / kernel-devel / ...
- windows下制作PHP扩展
一.编译PHP 转自:http://demon.tw/software/compile-php-on-windows.html 编译PHP扩展必需的一些头文件需要从php源码中获取,其中有一些配置性的 ...
- nginx源码分析—内存池结构ngx_pool_t及内存管理
Content 0. 序 1. 内存池结构 1.1 ngx_pool_t结构 1.2 其他相关结构 1.3 ngx_pool_t的逻辑结构 2. 内存池操作 2.1 创建内存池 2.2 销毁内存池 2 ...
- Epoll模型详解
Linux 2.6内核中提高网络I/O性能的新方法-epoll I/O多路复用技术在比较多的TCP网络服务器中有使用,即比较多的用到select函数. 1.为什么select落后 首先,在Lin ...
- Android Studio IDE 主题设置
1.界面主题设置,如下图: 2.代码字体设置,如下图:
- swift NSUserDefaults的基本使用
import UIKit @UIApplicationMain class AppDelegate: UIResponder, UIApplicationDelegate { var window: ...
- cocos2dx 3.x(精灵的碰撞检测，点击移动与拖动精灵)
// // MainScene.hpp // helloworld // // Created by apple on 16/9/19. // // #ifndef MainScene_hpp #de ...
- mysql高负载的问题排查
http://dngood.blog.51cto.com/446195/1150031 log_slow_queries = /usr/local/mysql/var/slow_queries.log ...
- EBS安装提示libXtst.so.6: cannot open shared object file
$ ./rapidwiz Rapid Install Wizard is validating your file system...... CMDDIR=/app/Stage122/startCD/ ...
- sh.status()
mongos> sh.status({"verbose":1})sh.status({"verbose":1}) --- Sharding Status ...