HTML Tags
HTML <script> Tag
The
<script>tag is used to embed or reference JavaScript code in an HTML document.
It allows you to create interactive features, handle events, manipulate the DOM, and perform dynamic operations on a webpage.
Syntax
html
<script>
// JavaScript code here
</script>
<!-- OR referencing an external file -->
<script src="script.js"></script>Attributes
| Attribute | Description |
|---|---|
| src | Specifies the URL of an external script file. |
| type | Specifies the scripting language. Default is text/javascript. |
| async | Loads the script asynchronously without blocking HTML parsing. |
| defer | Loads the script after the HTML is fully parsed. |
| crossorigin | Handles CORS requests for external scripts. |
| nomodule | Prevents execution in browsers that support ES modules. |
Example
html
<!DOCTYPE html>
<html>
<head>
<title>Script Tag Example</title>
<script>
function showMessage() {
alert("Hello! This is a message from JavaScript.");
}
</script>
</head>
<body>
<h1>Click the button to see the message</h1>
<button onclick="showMessage()">Click Me</button>
</body>
</html>Browser Support
Chrome | Edge | Firefox | Safari | Opera | IE9+ |
|---|---|---|---|---|---|
| Yes | Yes | Yes | Yes | Yes | Yes |
The <script> tag itself is invisible, but it can execute code that displays alerts, modifies content, or responds to user actions.
Notes
- The
<script>tag can contain inline JavaScript or reference an external file. asyncanddeferhelp improve page load performance.- Scripts can be placed in
<head>or at the end of<body>for faster rendering. - Always ensure scripts are properly secured to prevent XSS vulnerabilities.
Conclusion
The <script> tag is essential for adding dynamic behavior and interactivity to HTML pages.
Although it does not produce visual content directly, it powers most modern web functionality, making it a core element in web development.