Any script which manipulates DOM structure needs to wait till the document has loaded. The traditional way to do this was to use window.onload method
e.g.
window.onload = funcerion ()
{
alert("document loaded");
}
However the above method has drawbacks. It will wait till the entire document is loaded including images. Now if a web page is image heavy, the above alert won't be displayed until all the images have loaded. Ideally you want the function to execute once the DOM structure is ready.
An alternative is jQuery document ready method
e.g.
$(document).ready(function() { alert("DOM loaded");});
The above function can also be written as
$(function() {
alert("DOM loaded");
});
The beauty of ready method is that you can have more than one for the same document and they all will execute in the order they are written. You can only have one window.onload method for one document.
e.g.
window.onload = funcerion ()
{
alert("document loaded");
}
However the above method has drawbacks. It will wait till the entire document is loaded including images. Now if a web page is image heavy, the above alert won't be displayed until all the images have loaded. Ideally you want the function to execute once the DOM structure is ready.
An alternative is jQuery document ready method
e.g.
$(document).ready(function() { alert("DOM loaded");});
The above function can also be written as
$(function() {
alert("DOM loaded");
});
The beauty of ready method is that you can have more than one for the same document and they all will execute in the order they are written. You can only have one window.onload method for one document.
Comments