src (HTML attribute)

Spec
Depr. Version
No HTML 4
Browser support (more…)
IE5.5+ FF1+ SA1.3+ OP9.2+ CH2+
Full Full Full Full Full

Syntax

src="uri"

Description

The power of JavaScript is revealed when common functionality can be shared across a web site, rather than needing to be embedded at the page level over and over again. To achieve this goal, all you need to do is create your JavaScript in a standalone file, save it with the .js extension, and then refer to it using the src attribute in the script element. The same rules about locating the resource apply as they do to other external resources (images, links to other pages, and so on). Including "../" in the src indicates that the browser should request the file from a directory one level above the current directory (that is, the directory in which the referring page resides), and "/" indicates that the browser should start looking in the domain document root.

If the src attribute contains a valid URI, the browser should ignore any content that’s found inside the opening <script> and closing </script> tags, as illustrated in this code:

<script type="text/javascript" src="/scripts/complex.js">
  //the next line should be ignored if /scripts/complex.js exists
  alert("Well howdi ho, pardners!");
</script>

When the browser is presented with the above code, the annoying alert should not be displayed to the user; only the contents of complex.js should be processed (all the browsers tested honor this markup).

Example

In this example, the src attribute refers to a script file named "complex.js":

<script type="text/javascript" src="/scripts/complex.js"></script>

Value

The src attribute takes as its value the location of the destination document as:

  • relative to the referencing document
  • relative reference to the server root
  • a complete URI
  • the server name, and the path to the document on that server

Compatibility

Internet Explorer Firefox Safari Opera Chrome
5.5 6.0 7.0 8.0 1.0 1.5 2.0 3.0 3.5 1.3 2.0 3.1 4.0 9.2 9.5 10.0 2.0
Full Full Full Full Full Full Full Full Full Full Full Full Full Full Full Full Full

It causes no compatibility issues, and has excellent support across all tested browsers.

User-contributed notes

There are no comments yet.

Related Products