Home > Developer > JavaScript
This is my first study of JavaScript Learning Diary, at the beginning of writing this Bolg feel very basic and nowhere to write, but to put JavaScript code in the <script> element tag, Running the file allows JavaScript code to be loaded and parsed. But think carefully, in fact, there are many details of the place to pay attention to, such as script tags placed in different places will have different effects, why the <script> placement of different effects, script synchronous loading and asynchronous loading is different and so on. So writing this blog is the first step in learning JavaScript (^_^). In fact, learning a language will not take too long, will soon get started, but also will soon forget. This requires the important knowledge points to be recorded, I use the Youdao cloud notes, the newly learned knowledge or not the problem, through the access to data to solve all of them recorded. The results are good and can be reviewed every week. In addition to write this blog, oneself also have some new sentiment, we often sigh many technology Daniel, blog celebrity How fierce, in fact, we can become the technical leader, one is the accumulation of knowledge and project experience, and secondly, I think is learning knowledge on the details of the grasp, its three, Can persevere, continue to learn new technology, usually constantly review, "warm so know new." Well, said a little tricky, began to get to the point. Yes, I am also a small white one, is learning the way, blogging is to summarize the daily learning, self-reflection. The ancients said "My day provinces" is very reasonable oh.
How to use JavaScript in HTMLMain content :
1.1 JavaScript Introduction
1.2 <script> elements
1.3 Deferred scripts and asynchronous scripts
JavaScript is the most popular scripting language on the Internet, which can be used in HTML and the Web, and is more widely used in servers, PCs, laptops, tablets and smartphones. JavaScript is a programmatic code that can be inserted into an HTML page. JavaScript is easy to learn. JavaScript is a literal-translation scripting language, which is a dynamic type, a weak type, a prototype-based language, and a built-in support type. Its interpreter, known as the JavaScript engine, is widely used as a scripting language for the client, and is used in HTML (an application under the standard Universal Markup Language) to add dynamic functionality to an HTML Web page.
JavaScript consists of the following three different parts:
ECMAScript, provides core language features.
The Document Object Model (DOM), which provides methods and interfaces for accessing and manipulating Web page content.
The browser object model (BOM), which provides methods and lessons for interacting with the browser.
HTML DOM (Document Object model)
When a Web page is loaded, the browser creates a Document object model for the page.
The HTML DOM model is constructed as a tree of objects.
HTML DOM Tree
With the programmable object model, JavaScript has the ability to create dynamic HTML.
JavaScript can change all HTML elements in a page
JavaScript can change all HTML attributes in a page
JavaScript can change all CSS styles in a page
JavaScript can react to all the events in the page
Refer to JavaScript's Reference manual for Javascripthe, BOM, and Dom.
<script>the script in the HTML must be between the <script> and </script> tags. the script can be placed in the <body> and
<script> and </script> will tell JavaScript where to start and end.
The lines of code between <script> and </script> contain JavaScript:
< Script > alert ("My first JavaScript"); </ Script >you don't need to understand the code above. Just understand that the browser interprets and executes JavaScript between <script> and </script>. Older instances may use the type= "Text/javascript" in the <script> tag. It is not necessary to do so now. JavaScript is the default scripting language in all modern browsers and HTML5.
There are two ways to use <script>, one is to embed JavaScript code directly in the page, and the other is to include an external JavaScript file. The JavaScript code contained within <script> will be interpreted in turn from top to bottom. You can also save the script to an external file. External files typically contain code that is used by multiple Web pages. The file name extension for external JavaScript files is. js. to use an external file, set the. js file in the "src" attribute of the <script> tag:
<! doctype html > < html > < body > < script src = "Myscript.js" ></ script > </ body > </ html >
In addition, the SRC attribute of the <script> element can also set the JavaScript file from the external domain, which makes <script> more powerful, which is somewhat similar to the element. Its src attribute can point to the full URL of a domain other than the HTML page; The SRC attribute of the <script> element can be a JavaScript code file for a Web site.
<! DOCTYPE html>
<HTML><Body>
<p>welcome my blog----masterhanblog</p>
<Scriptsrc= "Myscript.js"src= "Http://www.somewhere.com.afile.js"></Script></Body></HTML>
The code that is located in the external domain is also parsed by the load, however, as long as there are no defer and async attributes (as explained later), the browser will parse sequentially in the order of the code in the <script> element. In other words, after parsing the code in the first <script>, the second <script> included code will be parsed and then the third one ....
The location of the label
As a traditional practice, all <script> elements should be placed in the
Deferred scripts and asynchronous scripts
The execution of HTML scripts is only synchronized and blocked by default. The <script> tag can have defer and async attributes, which can change how the script executes. These are Boolean properties, no values, just need to appear in the tag.
The Defer property allows the browser to delay the execution of the script until the document is loaded and parsed before it can be manipulated. That is, the script is delayed until the entire page is parsed and is running. So setting this property is equivalent to telling the browser to download the JavaScript file immediately, but defer execution. HTML5 Specifies that defer is used only for external script files, and the defer property set for embedded scripts is ignored for inline scripting.
The Async property allows the browser to execute the script as quickly as possible without blocking the parsing of the document while the script is being downloaded. The purpose of specifying async is to not allow the page to wait for the script to be downloaded and executed, thus asynchronously loading other content on the page. Therefore, it is recommended that asynchronous scripts do not modify the DOM during loading. Similarly, HTML5 specifies that async is used only for external script files, and the async attribute set for embedded scripts is ignored for inline scripting.
If the browser supports two properties at the same time, the defer property is ignored in accordance with the Async attribute. Note that deferred scripts are executed in the order in which they appear in the document. Asynchronously executes after they are loaded, which means they may be executed in an unordered order. In a browser that does not support the async attribute, asynchronously loading and executing the script is implemented by dynamically creating the <script> element and inserting it into the document.
function loadasync (URL) { = document.getElementsByTagName ("head") [0]; = document.createelement ("script"); = URL; Head.appendchild (s);}This diary summary:
Knowledge Extension:
JavaScript Learning Notes (i) How to use JavaScript in HTML
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
