Professional JavaScript | 18 | WebReference

Professional JavaScript | 18

1234
[previous] [next]

Professional JavaScript

<SCRIPT>

The <SCRIPT> HTML tag is the main way of connecting JavaScript to HTML. Any amount of JavaScript code can accompany the <SCRIPT> tag. It is a paired or block tag and has a number of attributes that can be set as this example shows:


<HTML>
<HEAD>
<SCRIPT>
  var step=1;                                // example 1.
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript"> step=2;      // example 2.
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript1.1"> step=3;   // example 3.
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript1.3"> step=4;   // example 4.
</SCRIPT>
<SCRIPT SRC="myfunctions.js">               // example 5.
</SCRIPT>
<SCRIPT TYPE="text/JavaScript"> step=6;     // example 6. HTML 4.0
</SCRIPT>
</HEAD>
</HTML>

Examples from 1 to 4 inclusive show the most common use: inline JavaScript. This form is called inline JavaScript because the JavaScript code inside the document is executed as soon as it is encountered when the browser is reading the HTML file. The one exception is if JavaScript functions are defined – they are stored away for later. In these examples, the JavaScript scripts are very trivial – just assigning a value to a variable – but could easily be quite complex, which would halt reading of the HTML until the script finished.

Each of the first 4 examples illustrates a different point.

Example 5 shows that a JavaScript script can be retrieved from another file. The value of the SRC attribute can be any valid URL that points to the file in question. This form is particularly handy if you have a large number of JavaScript functions that are used in several HTML documents. Rather than type the functions into every document, store them in a separate file containing pure JavaScript (no HTML) and use SRC in every HTML document that needs them. The content of the file will be executed immediately, in the same way as for the earlier cases, but it's not referred to as inline JavaScript because it isn't physically in the same file.

Example 5 should not use the LANGUAGE attribute either. This is because the source file is retrieved from somewhere external to the HTML document and, therefore, the Web browser's normal mechanisms for detecting file type should be relied upon. Occasionally there is a problem getting this to work – if so, make sure any Web server you use knows that a .js file is an 'application/x-JavaScript' MIME type with a .js filename extension. You can use URLs in the SRC attribute that accesses files on the local disk if you're not using a Web server. No special setup is required in that case.

The HTML 4.0 standard uses a different attribute, TYPE, specifying a MIME type of 'text/JavaScript' for JavaScript, but only Internet Explorer 4+ and Navigator 4+ support this attribute, so it's less portable. It is illustrated in example 6.

The two biggest benefits of inline JavaScript are that you can affect the HTML as it is being read and rendered in the browser, and you can declare functions for later use, possibly organized in a modular manner in separate files.

1234
[previous] [next]
and Created: February 12, 2001
Revised: March 5, 2001

URL: http://webreference.com/programming/javascript/professional/chap4/