"Go" jquery Page load Complete event

Source: Internet
Author: User


There are two kinds of events for page load completion:

One is ready, indicating that the document structure has been loaded (not including pictures and other non-text media files);

The second is onload, indicating that the page contains pictures and other files, including all the elements are loaded complete.






1. Dom Ready

This is usually how you start writing scripts when using JQ:

$ (function () { 
      //do something 
});

For example:

$ (function () {
     $ ("a"). Click (function () {
           alert ("Hello world!");
      })

This example is to bind a click event to all the a tags. That is, when all the links are clicked by the mouse, alert ("Hello world!") is executed;
That is, when the page is loaded, it is triggered when it is actually triggered.
In fact this is the shorthand for JQ ready (), which is equivalent to:

$ (document). Ready (function () {
     //do something
})
//or the following method, the default parameters for Jquer are: "Document";
$ (). Ready ( function () {
    //do something
})

This is the JQ ready () method is Dom ready, and his role or meaning is that the DOM can be manipulated after the completion of the load.
Generally a page response load order is, domain name resolution-load html-load js and css-loading pictures and other information.
Dom ready should be able to manipulate the DOM between "load JS and css" and "load pictures and other information".

2. Dom Load

When using native JS, we usually use the onload time to do something, such as:

Window.onload=function () {
      //do something
}
//or frequently used picture
document.getElementById ("Imgid"). onload= function () {
     //do something
}

This is the DOM load, and his role or meaning is that the DOM can be manipulated after the document is loaded, including other information such as loading pictures.
Then DOM load is the "load pictures and other information" in the order in which page responses are loaded, and then the DOM can be manipulated.

Finally, attach a section of jquery code that executes before all the DOM elements are loaded.

<script type= "Text/javascript" >
(Function () {
            alert ("Dom is not loaded!")
        (jQuery)
</script>





Original address: http://www.cnblogs.com/feiyuhuo/p/5097385.html



Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.