ReferenceStandard

Scripts and fallback: script and noscript

Script embeds executable code, links to a script resource, or stores a supported non-executable data block.

Intermediate3 min readLearn · Practice · Review

Published by HTML Code Runner · AI-assisted material · Independent editorial review pending · Editorial policy

On this page

Purpose and content model

Script embeds executable code, links to a script resource, or stores a supported non-executable data block. Its behavior depends on type and other attributes. A classic script without suitable loading controls can block parsing while it is fetched and executed. Module scripts have a different loading and dependency model.

Noscript provides content for environments where scripting is disabled or unsupported under its context-specific parsing rules. It does not catch a JavaScript runtime error, a failed network request, or an unsupported API when scripting remains enabled. Design useful HTML first, then enhance it deliberately.

Syntax and working example

<script src="/assets/navigation.js" defer></script>
<noscript><p>The lesson text remains available. Interactive practice requires JavaScript.</p></noscript>

Supported attributes and behavior

Script supports src, type, async, defer, crossorigin, integrity, referrerpolicy, nonce, nomodule, fetchpriority, and newer loading-related attributes where supported. Defer applies to external classic scripts and preserves order after parsing; async executes when ready and does not preserve dependency order. Type=module requests module semantics. JSON data blocks use a non-JavaScript media type such as application/json. Noscript uses global attributes and has restricted head placement rules.

Another practical pattern

<script type="module" src="/assets/app.js"></script>
<script type="application/json" id="page-data">{"course":"HTML","lesson":3}</script>

Accessibility and browser notes

Make essential navigation and content available without depending on successful script execution. Announce meaningful asynchronous changes without overwhelming users. External scripts can affect privacy, performance, and security, so each dependency needs a concrete purpose and an appropriate deployment policy.

Common mistakes

Defer does not make inline classic scripts deferred. Async can break scripts that assume a previous dependency has executed. A noscript message will not appear when JavaScript is enabled but your code crashes. A closing script sequence inside embedded data requires safe serialization rather than naive string concatenation.

Verify your implementation

Test with scripting disabled, with the script URL blocked, and with a deliberate runtime failure. Inspect loading order and console errors. Verify Content Security Policy and integrity behavior on the exact deployed resource, and keep dynamic source generation separate from untrusted text.

Standard status and sources

Standard; browser availability must be checked independently of specification status.

HTML specification · MDN reference and compatibility data