HTMLScriptElement

Jump to:
  1. Properties
  2. Methods
  3. Examples
  4. Specifications
  5. Browser compatibility
  6. See also

HTML <script> elements expose the HTMLScriptElement interface, which provides special properties and methods for manipulating the behavior and execution of <script> elements (beyond the inherited HTMLElement interface).

JavaScript files should be served with the application/javascript MIME type, but browsers are lenient and block them only if the script is served with an image type (image/*), video type (video/*), audio type (audio/*), or text/csv. If the script is blocked, its element receives an error event; otherwise, it receives a success event.

Properties

Inherits properties from its parent, HTMLElement.

Name Type Description
type DOMString Represents the MIME type of the script. It reflects the type attribute.
src DOMString Gets and sets the URL of an external script. It reflects the src attribute.
event DOMString An old, quirky way of registering event handlers on elements in an HTML document.
charset DOMString Represents the character encoding of an external script. It reflects the charset attribute.
async Boolean

The async and defer attributes are boolean attributes that control how the script should be executed. The defer and async attributes must not be specified if the src attribute is absent.

There are three possible execution modes:

  1. If the async attribute is present, then the script will be executed asynchronously as soon as it downloads.
  2. If the async attribute is absent but the defer attribute is present, then the script is executed when the page has finished parsing.
  3. If neither attribute is present, then the script is fetched and executed immediately, blocking further parsing of the page.

The defer attribute may be specified with the async attribute, so legacy browsers that only support defer (and not async) fall back to the defer behavior instead of the default blocking behavior.

Note: The exact processing details for these attributes are complex, involving many different aspects of HTML, and therefore are scattered throughout the specification. These algorithms describe the core ideas, but they rely on the parsing rules for <script> start and end tags in HTML, in foreign content, and in XML; the rules for the document.write() method; the handling of scripting; and so on.
defer Boolean
crossOrigin DOMString A DOMString reflecting the CORS setting for the script element. For scripts from other origins, this controls if error information will be exposed.
text DOMString

The IDL attribute text joins and returns the contents of all Text nodes inside the <script> element (ignoring other nodes like comments) in tree order. On setting, it acts the same way as the textContent IDL attribute.

Note: When inserted using the document.write() method, <script> elements execute (typically synchronously), but when inserted using innerHTML or outerHTML, they do not execute at all.
noModule Boolean This Boolean property stops the script's execution in browsers that support ES2015 modules — used to run fallback scripts in older browsers that do not support JavaScript modules.

Methods

No specific methods; inherits methods from its parent, HTMLElement.

Examples

Dynamically importing scripts

Let's create a function that imports new scripts within a document creating a <script> node immediately before the <script> that hosts the following code (through document.currentScript). These scripts will be asynchronously executed. For more details, see the defer and async properties.

function loadError(oError) {
  throw new URIError("The script " + oError.target.src + " didn't load correctly.");
}

function prefixScript(url, onloadFunction) {
  var newScript = document.createElement("script");
  newScript.onerror = loadError;
  if (onloadFunction) { newScript.onload = onloadFunction; }
  document.currentScript.parentNode.insertBefore(newScript, document.currentScript);
  newScript.src = url;
}

This next function, instead of prepending the new scripts immediately before the document.currentScript element, appends them as children of the <head> tag.

function loadError(oError) {
  throw new URIError("The script " + oError.target.src + " didn't load correctly.");
}

function affixScriptToHead(url, onloadFunction) {
  var newScript = document.createElement("script");
  newScript.onerror = loadError;
  if (onloadFunction) { newScript.onload = onloadFunction; }
  document.head.appendChild(newScript);
  newScript.src = url;
}

Sample usage:

affixScriptToHead("myScript1.js");
affixScriptToHead("myScript2.js", function () { alert("The script \"myScript2.js\" has been correctly loaded."); });

Specifications

Specification Status Comment
HTML Living Standard
The definition of 'HTMLScriptElement' in that specification.		 Living Standard  
HTML 5.1
The definition of 'HTMLScriptElement' in that specification.		 Recommendation  
HTML5
The definition of 'HTMLScriptElement' in that specification.		 Recommendation The following properties are now obsolete: htmlFor,.
Document Object Model (DOM) Level 2 HTML Specification
The definition of 'HTMLScriptElement' in that specification.		 Obsolete No change from Document Object Model (DOM) Level 1 Specification.
Document Object Model (DOM) Level 1 Specification
The definition of 'HTMLScriptElement' in that specification.		 Obsolete Initial definition.

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
Basic supportChrome Full support 1Edge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
asyncChrome Full support YesEdge Full support YesFirefox Full support 3.6IE Full support 10Opera No support NoSafari Full support YesWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
charsetChrome Full support 1Edge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
crossOrigin
Experimental
Chrome Full support 1Edge Full support YesFirefox Full support 13IE No support NoOpera No support NoSafari Full support 4WebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 14Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
deferChrome Full support YesEdge Full support YesFirefox Full support 3.5IE Full support 10
Full support 10
No support 4 — 10
Notes
Notes Non-standard implementation
Opera No support NoSafari Full support YesWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
event
Deprecated
Chrome Full support 1Edge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
htmlFor
Deprecated
Chrome Full support 1Edge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
noModule
Experimental
Chrome Full support YesEdge No support NoFirefox Full support 60
Full support 60
No support 55 — 60
Disabled
Disabled From version 55 until version 60 (exclusive): this feature is behind the dom.moduleScripts.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE No support NoOpera No support NoSafari No support NoWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 60
Full support 60
No support 55 — 60
Disabled
Disabled From version 55 until version 60 (exclusive): this feature is behind the dom.moduleScripts.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
srcChrome Full support 1Edge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
textChrome Full support 1Edge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
typeChrome Full support 1Edge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.
Deprecated. Not for use in new websites.
Deprecated. Not for use in new websites.
See implementation notes.
See implementation notes.
User must explicitly enable this feature.
User must explicitly enable this feature.

See also

Document Tags and Contributors

Tags: 
Contributors to this page: sideshowbarker, jamesdhurd, ewwink, camilleriluke, fscholz, Tigt, kdex, Sebastianz, chrisdavidmills, arronei, libbymc, teoli, slimsag, andrewevans, Nexii, fusionchess, P0lip, Delapouite, Danacus, lborgman, kscarfone, Sheppy
Last updated by: sideshowbarker,