JavaScript Learning Notes (ii) using JavaScript in HTML

Using JavaScript in HTML requires only a single label <script> , although simple, but there is a lot of attention in the inside, and listen to the next slow way.

First, it is recommended to use <SCRIPT></SCRIPT> when using <script> tags, rather than using <script/>, because the latter is an XHTML notation and may not be parsed correctly in some browsers. such as IE. <script> tags can either embed code internally or reference external code. When both are present, only the external script file is downloaded and executed, and the embedded code is ignored. It is recommended to use external scripts because external scripts are maintainable and can be cached by the browser, greatly improving performance. Because the <script> tag uses the SRC attribute to introduce external JS documents, this feature enables cross-domain functions such as JSONP.

<script> tags are blocking the parsing of the page document , meaning that when the browser reads the <script> tag, the imported external file executes the download first and then performs a line-by-row parsing. This process the browser wholeheartedly in the processing of JS code, so that the page pauses here, will not load and display the remaining HTML documents. So if I put the <script> tag in the header

There are two interesting properties in the <script> tag, defer and async, which enable the ability to delay scripts and asynchronous scripting .

Defer attribute usage is to add defer= "defer" in the <script> tag, the function of this property is to tell the browser, you can download me while parsing the document, but can not execute, until you have finished parsing the page and then execute me. The Defer property supports only external scripts.

Async is similar to defer, which tells the browser that the download execution of the parsing document and <script> is completely asynchronous and can be done at the same time, but the script executes as soon as it is downloaded, and the execution of the script still blocks the parsing of the document.

I didn't quite understand the difference between defer and async until I saw this picture (from http://segmentfault.com/q/1010000000640869):

　　

Of course, it's a good habit to put <script> before the </body> tag, whether it's defer or async.

When the browser does not support JavaScript (which does not currently exist) or does not yet have JavaScript enabled, you can use the <noscript> tag to prompt the user about how stupid it is without JavaScript, such as:

　　

<noscript>    <p> This page requires browser support (enabled) Javascript. </p></noscript>

Finally, the document mode, the document mode is mainly through the document type (DOCTYPE) to switch, initially divided into promiscuous mode (quirks mode, also known as the Strange pattern) and the standard mode (standards mode, also known as strict mode). Promiscuous mode is turned on by default when the browser discovers that the document does not have a document type declaration, and the browser behaves and behaves differently in promiscuous mode, so it is recommended to declare the document type at the beginning of the HTML document.

For standard mode, the browser makes the document performance and behavior as standard as possible, with three ways of declaring it:

<!--HTML 4.01 Strict type--><! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01//en" "Http://www.w3.org/TR/html4/strict.dtd" ><!--XHTML 1.0 Strict Type-->& lt;! DOCTYPE htmlpublic "-//w3c//dtd XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" ><!-- HTML 5  --><! DOCTYPE html>

Then there are quasi-standard patterns, using transitional (transitional) or frameset (FRAMESET) document type trigger, their writing is not listed, see DOCTYPE at a glance. Quasi-standard mode and standard mode of performance are basically very similar, the difference can be neglected.

　　

　　

　　

JavaScript Learning Notes (ii) using JavaScript in HTML