Some things about the Jquery,js script loading execution sequencing

Source: Internet
Author: User

Long time no use of jquery, a recent thing to write about, and think about how the script to delay the implementation of some of the methods are different.

(1) The first way, of course, is to embed the script in the HTML where it needs to be done, and wait until the page is loaded and put it to the end. Of course, this is already a very dismissive approach, generally is a few tests AH what will be used or code on a few words, others rarely do so. As an external document introduced the advantages of not to repeat, generally understand.

(2) put the <Script> tag from head to 〈/body〉 before other HTML content. This is also very good understanding, the main HTML after the load, the script will start to run, of course, it is important to note that the loading of this is only referring to the DOM loaded, the picture is not necessarily loaded complete.

(3) Use the defer (deferred) attribute. This property indicates that the script executes without affecting the page construction, which means that the script will run after the entire page parsing is complete, and this is actually the same as the 2nd, except that the 〈script〉 tag can be placed in the head. However, the compatibility of this property to be verified, the old version of the browser only IE is supported, relatively newer browsers are supported.

(4) Use Async (Async) Properties. This property is a newly added property of HTML, as can be seen from the English explanation, this property is for loading between pages without blocking, is the parallel loading of related items, so and defer execution effect similar, but there is a different, may cause a serious problem of the script, is the time to run. Defer are sequential and executed in the order of the original statements, so that there is no impact on scripts that have dependencies, but async is executed when the download is complete, and if there is a dependency between the different scripts, it is possible to cause an unknown serious error (and of course it is possible to use it normally).

It's all about the sequencing of script loading, and the way it's executed is more varied.

(5) Call after the OnLoad event, note that this is done after all the elements of the page have been loaded, that is, the picture, Flash must be loaded before the script executes; Also, OnLoad can execute one and cannot execute multiple.

A) written in the body's onload event:


b) written in the script code

<script type= "Text/javascript" >      function func () {...}      Window.onload=func;</script>
<script type= "Text/javascript" >      function func1 () {...}      function Func2 () {...}      function func3 () {...}      Window.onload=function () {      func1 ();      Func2 ();      Func3 ();     } </script>

c) The wording of jquery

$ (window). Load (function () {    ...});

d) JS Custom function Multiple calls (I've never used an amount ")

<script type= "Text/javascript" >      function func1 () {...}      function Func2 () {...}      function func3 () {...}      function Addloadevent (func) {         var oldonload=window.onload;         if (typeof window.onload!= "function") {             window.onload=func;          }         else{             window.onload=function () {                  oldonload ();                  Func ();       }}} Addloadevent (func1);       Addloadevent (FUNC2);       Addloadevent (FUNC3);</script>

(6) jquery uses $ (document). Ready (), which is executed when the DOM is loaded, not all elements are loaded, and only one can be executed relative to onload, and ready has multiple and can be executed:

PS: To use JS Direct implementation, or a little trouble ~ ~

$ (document). Ready (function () {    ...});
Jane writes the following $ (function () { ...});

This is what I understand, write an essay and record it, lest you forget it again.

Some things about the Jquery,js script loading execution sequencing

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: 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.