W3docs

HTML <script> Tag

The HTML<script> tag is used to declare client-side script in an HTML document. Read about tag description, attributes, important notes and see examples.

The HTML <script> tag declares client-side script (JavaScript) in an HTML document. When defining a client-side script, the script tag is used for image manipulation, form validation, and dynamic changes of content. The tag can include either the script itself or a link to an external file containing scripts. The path to the external file is specified with the src attribute.

Danger

If you connect an external file with scripts, don’t embed script into the same <script> tag.

The HTML <script> tag can be placed in the <head> element, as well as within the <body> element. Scripts that must be executed first are often placed in the <head> element with defer, or at the end of the <body> element. The <script> tag can be used in an HTML document many times.

script tag example

Syntax

The <script> tag comes in pairs. The content is written between the opening (<script>) and closing (</script>) tags.

Important notes

There are a few ways an external script can be executed:

  • By default (without async or defer), the script blocks HTML parsing and executes immediately when encountered.
  • The defer="defer" attribute indicates that the script is executed after the HTML document has been fully parsed.
  • The async="async" attribute indicates that the script is executed asynchronously, as soon as it is downloaded, without blocking parsing.

For selecting an HTML element, JavaScript uses the document.getElementById() method.

Example of HTML <script> tag:

HTML script Tag

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <p id="example"></p>
    <script>
      document.getElementById("example").innerHTML = "My first JavaScript code";
    </script>
  </body>
</html>

Differences Between HTML 4.01 and HTML5

HTML 4 requires the type attribute, whereas it is optional in HTML5. In HTML5, the async attribute is a new one. HTML5 does not support the HTML 4.01 xml:space attribute.

Differences Between HTML and XHTML

In XHTML, the content inside scripts is declared as #PCDATA (instead of CDATA). In such cases, the entities will be parsed.

In XHTML, all special characters must be encoded, or all the content must be wrapped inside a CDATA section.

HTML script Tag example

<script type="text/javascript">
//<![CDATA[
var i = 10;
if (i < 5) {
  // some code
}
//]]>
</script>

Attributes

AttributeValueDescription
asyncasyncDefines that the script is executed asynchronously.
charsetcharsetDefines character encoding, used in an external file with the JavaScript code. Deprecated in HTML5.
deferdeferDefines that the script must be executed after the loading of the page.
srcURLDefines the URL of an external file with the JavaScript code. (Can be defined either relative, or an absolute URL).
typemedia_typeDefines the MIME-type of the script.

The <script> tag supports the Global Attributes and the Event Attributes.

Practice

Practice

What does the HTML <script> tag do?