An example of the role of JS script defer

The function of defer is to execute the script after the document is loaded, so as to avoid the problem of not finding the object. There is a good example below, and interested friends can refer to it.

<script src="../cgi-bin/delscript.js" defer></script> 
中的defer作用是文档加载完毕了再执行脚本,这样回避免找不到对象的问题---有点问题 
<button id="myButton" onclick="alert(&#39;ok&#39;)">test</button> 
<script> 
myButton.click(); 
</script> 
<script> 
myButton.click(); 
</script>
<button id="myButton" onclick="alert(&#39;ok&#39;)">test</button> 
<script defer> 
function document.body.onload() { 
alert(document.body.offsetHeight); 
} 
</script>

Added defer means that it will be executed after the page is completely loaded, which is equivalent to window.onload, but is more flexible than window.onload in application!

defer is an "unsung hero" among the powerful functions of scripting programs. It tells the browser that the Script segment contains code that does not need to be executed immediately, and, used in conjunction with the SRC attribute, it can also cause these scripts to be downloaded in the background, and the content in the foreground is displayed to the user normally.
But execute the script after the document is loaded

Finally, please note two points:

1. Do not call the document.write command in a defer-type script segment, because document.write Will produce a direct output effect.
2. Moreover, do not include any global variables or functions used by the immediate execution script in the defer script segment.

A common way to optimize performance is to set the "defer" attribute in the <script> tag when the script does not need to be run immediately. (The immediate script is not contained in a function block, so it will be executed during the loading process.) After setting the "defer" attribute, IE does not have to wait for the script to load and execute. This way the page will load faster. Generally speaking, this also means that immediate scripts are best placed in function blocks and handle the function in the onload handler of the document or body object. This property is useful when there are scripts that rely on user actions - such as clicking a button or moving the mouse to a certain area. But when there are some scripts that need to be executed during or after the page is loaded, the benefits of using the defer attribute are not great. </script>

It’s all the defer’s fault. It’s the reason for the error in viewing the full text of the website in the past two days.

Last weekend, this site launched Google ads. In order to prevent the investment in advertising from prolonging the page import time, I modified the Google Ad code and used defer to delay the import of ads. I have been using the FireFox browser. , and no problem has been found. Today, a friend came to this site to check information. She was using Maxthon. She told me that as soon as I checked the article, the page flashed past. Only then did I know there was a problem. I said that the visits to this website have been dropping in the past two days? After checking the reason, I found out that it was due to defer, because defer seemed to be invalid in Firefox, and the page was actually loaded with the original content, while in IE, due to delayed loading of the script, for the Google Ad script , which uses the writing method of Document.write, and because of defer. Google AD's script is detected as an iframe, so when the actual content of the Google advertisement is obtained, the entire page is covered, which causes the full text to be viewed in a flash.

It’s all my fault that I modified the code and didn’t test it like this. No matter what I change in the future, it needs to be tested in both IE and FireFox. I would like to express my most sincere apology for the difficulty in accessing it in the past two days!
Another: It is recommended that you use FireFox to access this site. The access and parsing speed and the consistency of the page layout are better!

The above is the entire content of this chapter. For more related tutorials, please visit JavaScript Video Tutorial!