$(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();
};
以上です。
随机推荐
- LNMP 环境发布项目
发布地址 /srv/www/wx 默认mysql 外部访问权限关闭,需开启 另:注意数据库没有导入,index.php会是空白 chmod -R 777 /var var的权限就变成777,var下的 ...
- UIActivityIndicatorView
1. activityIndicatorViewStyle 设置指示器的样式 UIActivityIndicatorViewStyleWhiteLarge UIActivityIndicator ...
- chrome 下载插件包及离线安装
最近需要测试http rest服务,由于chrome插件的轻便,首先想到了用chrome插件,在google商店找到Advanced Rest Client,用了一阵感觉不错. 于是项目组其他同事也要 ...
- v$osstat
SQL> select * from v$osstat; STAT_NAME VALUE OSSTAT_ID COMMENTS CUM ----------------------------- ...
- NABCD模式
各位用户: 我们的“昵妆”是为了帮助不会化妆的用户解决困难, 他们需要有适合他们的优质的化妆品和 正确的视频或者化妆师来指导他们,但是现有的方案并没有很好地解决这些需求,我们有独特的办法, ...
- PostgreSQL Replication之第十一章 使用Skytools（5）
11.5 关于walmgr 的介绍 walmgr 是一个简化基于文件事务日志传输的工具.早在过去的一些日子里(在9.0版本之前),使用walmgr来简化基本备份是很常见的.随着流复制的引入,情况有了一 ...
- session 实现保存用户信息
index.jsp <body> <div style="margin: 0 auto; width: 500px; text-align: center;"&g ...
- 20145207 《Java程序设计》第8周学习总结
前言: 这两天电路焊小车,有意思归有意思,确实挺忙的.博客到现在才写.执勤看的东西忘得好快呀,莫名的记不住.不说废话了,开始. 教材学习内容总结: 一.NIO和NIO2 1.NIO的定义 InputS ...
- nyist 518 取球游戏
http://acm.nyist.net/JudgeOnline/problem.php?pid=518 取球游戏 时间限制:1000 ms | 内存限制:65535 KB 难度:2 描述 今 ...
- csuoj 1120: 病毒
http://acm.csu.edu.cn/OnlineJudge/problem.php?id=1120 1120: 病毒 Time Limit: 3 Sec Memory Limit: 128 ...