<script>: The SCRIPT Element
Last updated: 2026-10-13
<script>The SCRIPT Element
Embeds or references JavaScript for interactivity; place in head or body, often at body end for faster rendering.
| Category | Scripts & Embedding |
|---|---|
| Content Model | Flow content |
| Allowed Parents | Any element that accepts flow content |
| Content Tag | Yes — requires closing </script> tag |
| Status | Standard |
📝 Syntax
<script src="app.js"></script>⚙️ Attributes
This element supports the global attributes plus the following:
| Attribute | Value | Description |
|---|---|---|
src | URL of an external script (inline code ignored when src is set). | |
type | Script type, default text/javascript (module for ES modules). | |
async | Executes as soon as downloaded, without blocking parsing. | |
defer | Runs after parsing, before DOMContentLoaded. | |
crossorigin | CORS setting for cross-origin scripts. |
▶ Example
Edit the code below and see the live result in the playground:
🌐 Browser Support
| Browser |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| <script> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Supported in all major browsers | |||||
Tip： Use src for external files; inline code goes between tags; async/defer apply only to external scripts.
❓ FAQ
QWhat is the difference between async and defer on script?
ABoth load external scripts without blocking:
async executes as soon as it downloads, order not guaranteed (good for standalone scripts like analytics); defer executes in order after DOM parsing (good for DOM-dependent main scripts). With neither, downloading blocks HTML parsing — modern external scripts should always have one.QShould script go in head or at the end of body?
AWith
defer, head is fine (download early, render not blocked); inline scripts or DOM-dependent scripts without defer go at the end of body. The modern default is head + defer — module scripts are deferred automatically anyway.QWhat is special about script type='module'?
AIt enables ES Modules: import/export support, automatic strict mode, default deferred execution, and isolated scope (no global pollution). Classic non-module scripts run in global scope and execute synchronously. New projects should standardize on module.
🏷️ Related Tags
💡 Related Cases
More case studies coming soon — check back later.
📚 Related Tutorials
