Introduction:
Using this JQuery Tutorial we will learn what are differences between the Document.Ready event and window.load event in the JQuery Sample Example.Description:
In the Previous tutorials we have learnt How to debug javascript or jquery code in Internet Explorer, Mozilla firefox and Google chrome.
In this JQuery Tutorial:
1. Document.Ready event will fire when ever DOM is loaded.2. Window.load event will fire after loading all assets of the web page(Ex: Images, IFrames and others).
For more information
Output of below example:
Please look on below example first DOM loaded pop up will come, after that window loaded pop up will come{After complete image is loaded in the webpage.}.Sample program:
<!DOCTYPE>
<html>
<head>
<title>Differences between</title>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>
//first DOM will load
$('document').ready(function() {
alert('DOM loaded');
});
//in this program, after image will load this event will fire.
$(window).load(function() {
alert("window loaded");
});
</script>
</head>
<body>
<img src="http://static4.businessinsider.com/image/5384c698ecad04a913dfdb95/google-made-the-tiniest-change-to-its-corporate-logo--see-if-you-can-even-spot-it.jpg" />
</body>
</html>
Output Video:
Post a Comment