HTML <script> Tag

Last Updated : 27 Aug, 2024

The HTML <script> tag embeds client-side scripts or links to external JavaScript files, enabling dynamic content, form validation, and style manipulation. Attributes like async, defer, and src control script execution and loading, enhancing the interactivity and performance of web pages.

Syntax

// For Internal JavaScript Linking
<script> Script Contents... </script>

// For External JavaScript Linking
<script src="script.js"></script>

Attributes

Attributes	Descriptions
async	It is used to specify the script is executed asynchronously.
cross-origin	It is used for loading an external script into their domain from a third-party server or another domain with the support of HTTP CORS Request.
defer	It is used to specify that the script is executed when the page has finished parsing.
integrity	It is used to give permission to the Browser to check the fetched script to make ensure the source code is never loaded.
nomodule	It indicates that the script should not execute in the browsers that support ES module. It is a boolean attribute.
nonce	It is used by Content Security Policy to check whether a given fetch will be allowed to proceed for a given element or not.
referrerpolicy	It is used to specify the reference information that will be sent to the server when fetching the script.
src	It is used to specify the URL of an external script file.
type	It is used to specify the media type of the script.

Note: This tag supports all the Global attributes.

Example 1: Add script tag inside the body section of HTML document.

HTML

<!DOCTYPE html>
<html>

<head>
    <title>HTML script Tag</title>
</head>

<body>
    <h2>HTML script Tag</h2>

    <p id="GFG"></p>

    <!-- HTML script Tag Starts Here -->
    <script>
        document.getElementById("GFG").innerHTML
            = "Hello GeeksforGeeks!";
    </script>
    <!-- HTML Script Tag Ends Here -->

</body>

</html>

Output:

Example 2: Add script tag inside the head section of HTML document.

HTML

<!DOCTYPE html>
<html>

<head>
    <title>HTML script Tag</title>
</head>

<body>
    <h1>GeeksforGeeks</h1>
    <h2>HTML script Tag</h2>

    <button type="button" onclick="Geeks()">
        Hello GeeksforGeeks
    </button>
    <script>
        function Geeks() {
            alert('Welcome to GeeksforGeeks!');
        } 
    </script>
</body>

</html>