script (HTML element)

Description

The script element is used to enclose a series of statements in a scripting language that’s processed on the client side (that is, it’s processed by the user’s computer, rather than being processed on the server before being sent to the user’s computer). The language that’s used may be JavaScript or the Internet Explorer-specific VBScript. These days, however, it’s extremely rare to find examples of VBScript used in client-side scripting, except for web pages or applications that are used on intranets whose client base uses Internet Explorer exclusively (and even then, it’s not a good idea to do this!).

As well as enclosing scripting statements within the opening <script> and closing </script> tags, you can use this element to refer to an external script file through the src attribute, usually saved with the .js extension, which allows scripts to be shared across an entire site easily.

It’s common practice to place all JavaScript functions within script elements inside the head element, from where they’re available for use by all the markup on the page that follows. In fact, you can place a script element anywhere on a page, as shown in the following example (whereby a username is dynamically written into the page using an existing JavaScript variable):

<p>Well, hello there, <script>writeUserName();</script>,
    how's your day been so far?</p>

Note that there are some important differences in the way that HTML 4 and XHTML 1 deal with the content inside scripts.

In HTML 4, the content type is declared as CDATA, which means entity references won’t be parsed. The first occurrence of </ followed by a name start character actually terminates the script element, so something like this should fail: document.write("<p>Hello!</p>"). In practice, although it’s invalid, browsers recover from that error and don’t terminate the script until they reach the </script> tag. Actually, using the document.write() statement is, in itself, a problem in XHTML: document.write() can’t be used in XHTML documents that are served as XML, due to the way XML is parsed and processed (using it modifies the input stream in a way that isn’t compatible with XML parsing requirements).

In an XHTML 1 document that’s properly served using the MIME type "application/xhtml+xml", the content type is declared as (#PCDATA), so entities will be parsed and only a </script> tag will terminate the element. This means special characters need to be encoded—for example, ampersands will be encoded as &, and greater-than symbols will be encoded as >—or all content should be wrapped inside <![CDATA[ … ]]> sections. To ensure that the content inside the opening <script> and closing </script> tags is parsed correctly when it’s included within an XHTML document, use the following comment syntax:

<script type="text/javascript"><![CDATA[
  //script goes here
  ⋮
  //]]></script>

It’s not advisable to use the HTML comment syntax <!-- --> to hide script content from older browsers.

Use This For …

The uses for the script element are many and varied; in fact, they’re limited only by your imagination, your scripting skills, and your computer’s capabilities. Typical uses for JavaScript include image swapping and manipulation, making dynamic changes to content, drag-and-drop functionality, form validation, and so on. This topic really deserves a whole book in its own right.

Compatibility

Support for embedding the script element on the page is not an issue. However, the way that different browsers handle the content—the scripting language itself—can vary massively, depending on the content that’s contained. This discussion is well beyond the scope of this reference.