JS entry function and JQuery entry function. js entry function jquery

JS entry function and JQuery entry function. js entry function jquery

First, let's talk about their differences:

(1) The JS window. onload event must be executed after all the content and files such as external images are loaded.

(2) The JQuery entry function is executed after all labels are loaded.

Next, I will explain the implementation of JQuery entry functions through a coverage problem in JS.

The JS entry function window. onload has a coverage problem. When there are two window. onload functions in the document, the latter will overwrite the former, and the function cannot be implemented. But JQuery does not have such a problem. The important reason is that the JQuery entry function is only a call to the encapsulated method, but the passing parameters are different.

Finally, let's talk about the implementation of the JQuery entry function ($ (document). ready.

First, in the script tag, we first create a function variable named $, and then call it later. It does not have any effect, because it calls only an empty object without any parameters. If we want to continue calling after $ (), we still need to do some work. Let's see if there is a ready method in the JQuery entry function. Then we can create an object attribute called ready and point ready to an anonymous function, now we can use $ (). ready.

We can use a specific function to test:

Then, the JQuery entry function can pass in a function (passed as a variable), that is, $ (). ready (function () {}), and then receives it using a form parameter (func) variable. Therefore, you only need to call this method (func.

Next let's take a look at the document parameter in front of the JQuery entry function, that is, $ (document). ready (function () {}). This is exactly the same as the JQuery entry function. It also needs to be received with a variable. Finally, you only need to judge whether the onload event (or whether it has been assigned a value) in the ready function ):

(1) Yes (assigned), receives an old function, reassigns an onload event, calls a new function first, and then calls the old function, in this way, there will be no coverage issues, and both functions are implemented.

(2) No. assign an onload event directly.

Finally, let's test it. Since the document does not have an onload event, we can use window to try it out.

This avoids function coverage.