Many people are already proficient in using Javascript, but when they see defer, they may not know what it is used for; many people have also encountered such a problem, and they need to directly execute other js and manipulate DOM objects and always report Object not found error. As everyone knows, the reason is that the page has not been loaded yet, and the js operation object is still being downloaded. But many people don't know that adding the defer tag can easily solve this problem.
<script src="../CGI-bin/delscript.js" defer></script>
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---a bit of a problem
Copy the code code as follows:
<button id="myButton" onclick="alert('ok')">test</button>
<script>
myButton.click();
</script>
<script>
myButton.click();
</script>
<button id="myButton" onclick="alert('ok')">test</button>
<script defer>
function document.body.onload() {
alert(document.body.offsetHeight);
}
</script>
Adding defer means that it will be executed after the page is completely loaded, which is equivalent to window.onload, but it is more flexible than window.onload in application!
Defer is an "unsung hero" in the power of scripting. 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
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 to be 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 some scripts that need to be executed based 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.
The defer attribute in script is false by default. According to the description in the DHTML Programming Guide, the Defer attribute is written like this:
Using the attribute at design time can improve the download performance of a page because the browser does not need to parse and execute the script and can continue downloading and parsing the page instead.
In other words: if you add the defer attribute when writing a script, the browser does not have to process it immediately when downloading the script, but continues to download and parse the page, which will improve download performance.
There are many such situations. For example, if you define a lot of JavaScript variables, or write a lot of scripts in the reference file (.inc) that need to be processed, you might as well add the defer attribute to these scripts, which will definitely help improve performance.
Examples are as follows:
Copy the code code as follows:
<script language="javascript" defer>
var object = new Object();
....
</script>
Because the defer attribute defaults to false, then here
<script language="javascript" defer>
Explicitly declaring the defer attribute is equivalent to
<script language="javascript" defer=true>
After declaring the defer attribute, you need to determine whether other variables refer to the variables in the defer script block, otherwise a script error will occur.