HTML <script> Tag for JavaScript Code

If you find this helpful, please click the Google Button to the left, if it is white, to make it turn blue or red. Thank you! (It also helps find this page again more easily.)

The <script> Tag in HTML 5

Scripts failed or are disabled. Please make sure scripting is enabled.

This is an actual working example of the <script> tag example code below.

<script> Tag Syntax

Rules for coding HTML `script` elements

<head>
   ... metadata content ...
   <title>... text content ...</title>
   ...
   <script type="text/javascript" src="..."></script>
   <script type="text/javascript">
      ... JavaScript code ...
   </script>
   ...
</head>

<script> Content Model

Contents of the <script> Tag

How to code a script element with an external script resource

<script type="text/javascript" src="..."></script>

Inside an element where metadata content or phrasing content is allowed, code one or more optional script elements.
Begin the script element with a starting <script> tag. The element name uses lower case letters and should be in the HTML namespace, which it will pick up automatically from the xmlns attribute on the <html> tag.
Specify the URL of the external JavaScript code in the src attribute.
Include any other attributes of the <script> tag as appropriate.
End the script element with a matching </script> closing tag.

How to code a script element with inline script code

<script type="text/javascript">
   ... JavaScript code ...
</script>

Inside an element where metadata content or phrasing content is allowed, code one or more optional script elements.
Begin the script element with <script>. The element name uses lower case letters and should be in the HTML namespace, which it will pick up automatically from the xmlns attribute on the <html> tag.
Include any other attributes of the <script> tag as appropriate.
Include the JavaScript code between the starting and ending <script> tags.
End the script element with a matching </script> closing tag.

<script> Tag Attributes

Attributes of the <script> tag

global attributes	In addition to the personal attributes of the <script> tag below, any of the common HTML attributes can also be coded.
`async="async"`	Sets the value of the <script async> boolean attribute to `true`. Omitting it sets to `false`.
`charset`
`defer="defer"`	Sets the value of the <script defer> boolean attribute to `true`. Omitting it sets to `false`.
`language`	deprecated - use the `type` attribute instead
`src`	a URI reference that resolves to the URL of a resource with JavaScript code Use percent escape codes as explained in the URL-encoding tutorial for any special characters in the URI reference. If the value of the `src` attribute resolves to an HTTP URL, it may contain any of the following components: protocol scheme, typically `http:` or else `https:` username, followed by an "@" host name or IP address port number, which defaults to 80 for the `http` scheme and 443 for the `https` scheme absolute or relative path search query, indicated by "?" If the protocol scheme, username, host name/IP address and port number are omitted the default is the current host - the same server as the base of the current document. If the path starts with a slash `/...`, it is an absolute path from the document root directory (AKA "web root") on the server. A relative path will be resolved relative to the base of the current document.
`type`	`type="text/javascript"` (default) `type="application/ecmascript"` `type="application/javascript"` `type="application/x-ecmascript"` `type="application/x-javascript"` `type="text/ecmascript"` `type="text/javascript1.0"` `type="text/javascript1.1"` `type="text/javascript1.2"` `type="text/javascript1.3"` `type="text/javascript1.4"` `type="text/javascript1.5"` `type="text/jscript"` `type="text/livescript"` `type="text/x-ecmascript"` `type="text/x-javascript"` `type="text/javascript;e4x=1"`

<script> Tag Examples

Examples of the `script` tag in HTML 5

<script type="text/javascript" src="external-script-file.js"/>

<script type="text/javascript">
<!--
   window.onload=alert("Hello JavaScript World!")
// -->
</script>

The HTML comments in this example do not comment out the JavaScript code. They will only hide the code from browsers without JavaScript support or with scripts disabled. In some cases, browsers give the user an option to disable scripts. This HTML code pattern was designed to allow hiding content inside a script element from any browsers that might otherwise treat that content as phrasing content rather than as JavaScript code.

Script with fallback

(see <script> tag demo above)

Since there are various mechanisms that can disable scripting without the browser being aware of it, the recommended way to provide fallback content for a script is to change from noscript content to scripted content in the script itself, like this:

<head>
...
<script type="text/javascript">
window.onload = function() {
   var elem = document.getElementById('noscript1');
   elem.textContent = "";
   var button = document.createElement('button');
   button.textContent = "Click Me!";
   var output = document.createElement('span');
   button.onclick = function() { output.textContent = 'Button got clicked!'; return false; }
   elem.appendChild(button);
   elem.appendChild(document.createElement('br'));
   elem.appendChild(output);
}
</script>
...
</head>
<body>
...
<div id="script-tag-demo">
<p id="noscript1">Scripts failed or are disabled. Please make sure scripting is enabled.</p>
</div>
...
</body>

Changes in HTML 5 - <script> Tag

What's new in HTML 5

The async="async" attribute has been added.

Differences between HTML 5 and earlier versions of HTML

The following attributes should not be coded on the <script> tag because they either have been deprecated or were never officially supported:

language - use the type attribute instead

The 2000-2010 Recommendations from the W3C HTML Working Group defined the HTML namespace for the script element type name along with the names of all HTML element types. In older (pre-2000) versions of HTML, element type names were not associated with a namespace.

Valid HTML 5