In earlier versions of HTML, the tag’s
The path/to part needs to be accurate, but the path can be relative to the HTML page or absolute (see the following sidebar).
.js file extension.
There are five more things you should know about using
script. First, as with most HTML elements, you can use multiple instances of
script within a single HTML page. In fact, you commonly will.
Second, each use of
CDATA tags, which leads to some awkward and ugly syntax:
Relative vs. Absolute Paths
A common point of confusion, especially among beginning Web developers, is the proper way to reference other files and folders. There are two options: use an absolute path or a relative path. An absolute path begins at a fixed and consistent point, such as the root of the Web site. In HTML, absolute paths always begin with either
/ or just / (replace domain with your actual domain, such as www.example.com). Therefore, the absolute path to the index file in the Web root directory would be
/index.html or just
/index.html. An absolute path to
file.js, found in the root directory’s
js folder, would be
/js/file.js or just
/js/file.js. The benefit of using an absolute path is that it will always be correct, regardless of where you use it: An absolute reference works and is the same for
index.html in the main directory and for
somepage.html in a subdirectory.
A relative path is always relative to the HTML page making the reference and will not begin with either
/. To begin a relative path, you can start with a file name. For example,
another.html is a relative reference to the file
another.html, found in the same directory as the current file. To create a relative path to a file found within a subdirectory, start with the subdirectory’s name, followed by the name of the file (or by other subdirectories as needed):
js/file.js. Some people prefer to begin relative paths with a single period and a slash, the combination of which represents the current directory. Thus,
./another.html is the same as
./js/file.js equates to
js/file.js. To move up to a parent directory, use two periods together. For example, if
page.html, in a subdirectory, needs to include
file.js, in the main directory’s
js folder, the correct relative path would be
../js/file.js: up a directory and then into the
The technical reason for this is complicated, but it has to do with how data within
script is parsed in XHTML. The
<![CDATA]> wrapper prevents certain entities from causing problems. However, because
<![CDATA[ and the closing
Fourth, it’s common to place
script elements within the HTML head, but that’s not required. In fact, many current developers advocate placing
script elements near the end of the HTML whenever possible. Yahoo!, for example, recommends putting
script tags just before the closing
body tag. The argument for doing so is that it improves how quickly the page seems to load in the browser. This is because when the browser encounters a
script tag, it will immediately start downloading that script (assuming the script is not already cached). The browser will not be able to continue downloading the HTML, and therefore display it, until the script(s) have downloaded.
Finally, try not to use too many external scripts in the same HTML page. Doing so will also hurt performance.