The role of script tags in JS

The role of script tags in JS

In web development, JavaScript (JS for short) is a relatively common scripting language. The script tag is a way to embed JavaScript code in an HTML document. This article will introduce in detail the role of the script tag and its specific code examples.

1. The role of script tag

1. Embedded script: The script tag is a way to embed JavaScript code into an HTML document. By writing JavaScript code in script tags, you can implement rich functions, such as form validation, page interaction, event processing, etc.
2. Introducing external scripts: The script tag can be used to introduce external JavaScript script files. By specifying the path to an external script file through the src attribute, web pages can achieve code reuse and reduce the size of HTML documents.
3. Lazy loading: The async and defer attributes in the script tag can control how the script is loaded. The async attribute indicates that the script is loaded asynchronously, executed immediately after loading, and does not prevent the parsing of the HTML document. The defer attribute indicates that the script is delayed and will be executed immediately after the HTML document is parsed.

2. Specific code examples

1. Embedded script
   <script><br> function sayHello() {<br> alert('Hello, World! ');<br> }<br> sayHello();<br></script>
   The above code defines a function named sayHello in the script tag, and pops up a prompt box by calling the function "Hello, World!". This code can be directly inserted anywhere in the HTML document to achieve the corresponding interactive effect.
2. Introducing external script
   
   The above code will introduce an external script file named example.js, which requires In the same directory as the HTML document. Any legal JavaScript code can be written in the example.js file.
3. Delayed loading
   
   
   The above code uses the async and defer attributes respectively to perform asynchronous loading and delayed loading of scripts. The async attribute indicates that the script is loaded and executed asynchronously, while the defer attribute indicates that the script is delayed loaded and executed after the HTML document is parsed.

It should be noted that the async attribute can only be used when the script does not depend on other scripts or document content; the defer attribute is suitable for situations where it is necessary to ensure that the script is loaded and executed in order.

Summary:

The script tag plays an important role in JavaScript development. Through the script tag, we can embed scripts in HTML documents to achieve rich functions. At the same time, the script tag can also introduce external JavaScript script files to make the web page code more concise and clear. In addition, you can also use the async and defer attributes to control the loading method of scripts to achieve asynchronous loading and delayed loading of scripts.

Effective use of script tags will help improve the interactivity and user experience of web pages, improve development efficiency, and reduce code duplication. I hope this article helps you understand the role of script tags.

The above is the detailed content of The role of script tags in JS. For more information, please follow other related articles on the PHP Chinese website!