LIS 523/5 - JavaScript

According to Security Space (April, 2007), about 60% of Web sites use JavaScript.

There are some differences between versions of JavaScript; for example, Gecko, the engine used in more recent versions of Netscape Navigator, does not support the layer functions that were available in some earlier versions of Navigator. In addition to a version of JavaScript (sometimes referred to as JScript), Microsoft Internet Explorer also supports another scripting language called VBScript, which uses a subset of Visual Basic.

Simple JavaScript

A passage of script in an HTML file is introduced with the script tag and terminated with the /script tag. In addition, the statements within the script are normally commented out with <!-- and -->. Thus, the general form of a passage of JavaScript/JScript code in an HTML file is
    <script language="JavaScript1.1">
    <!-- JavaScript begins...
    Code goes here.
    // JavaScript ends -->
    </script>
Within JavaScript, // can be used to comment out the rest of a line, as in the second-last line above.

The noscript and /noscript tags can be used mark text that will be included only if the required scripting language or languages are not enabled; for example,

    <noscript>your browser does not have JavaScript1.1 enabled.
    </noscript>

A simple way to use JavaScript is just to have it insert bits of content into a page when the page is rendered. This can be done with the write or writeln method of the document object. The parameters of these methods can be any series of expressions or properties whose values you want displayed. For example, the following code is supposed to tell the user what browser type they are using:

    <script language="JavaScript1.1">
    <!-- JavaScript begins...
    document.writeln('you are using ', navigator.appName, '.')
    // JavaScript ends -->
    </script>
That is how this page can tell you that Browsers can lie about their identity, however, and often do.

Literal strings can be enclosed either in single quotes (as above) or in double quotes.

The dot notation is used for properties of objects (as in the example above). It is also employed for methods (functions associated with a particular type of object).

Variables

For scripting of any complexity, you need to make use of variables. Variables are fairly simple objects that are assigned values with the = operator. For example, the following code creates a new Date object for today's date, assigns it to the variable today, and then uses the Date object's getDay() method to display the day of the week as a number (where Sunday is 0, Monday is 1, and so on.)
    <script language="JavaScript1.1">
    <!-- JavaScript begins...
    today = new Date()
    document.writeln("(It's ", today.getDay(), ' today.)')
    // JavaScript ends -->
    </script>

Arrays

An array object can be used to contain a list, an individual item of which can be referenced by appending a numeric expression in square brackets to the array name. For example, the following code creates a new array containing the names of the days of the week and uses it to display the name of the day of the week today.
    <script language="JavaScript1.1">
    <!-- JavaScript begins...
    weekDays = new Array('Sunday', 'Monday', 'Tuesday', 'Wednesday',
        'Thursday', 'Friday', 'Saturday')
    today = new Date()
    document.writeln("(It's ", weekDays[today.getDay()],
         ' today.)')
    // JavaScript ends -->
    </script>

Debugging

Browsers do not provide much help with debugging problem JavaScript code. With the exception of Internet Explorer, however, they do generally provide optional consoles that display scripting errors. In Netscape, select "JavaScript Console" from the "Web Development" submenu of the "Tools" menu; in Firefox, select "JavaScript Console" directly from the "Tools" menu; in Opera, select "JavaScript Console" from the "Advanced..." submenu of the "Tools" menu.

In Internet Explorer, the procedure to see errors is a little more roundabout and the results a bit more limited:

  1. load a page that causes an error,
  2. double click on the exclamation-triangle symbol at the bottom left (in the status bar),
  3. check "Always display this message when a page contains errors",
  4. click on "Show Details >>",
  5. click on "OK".

For More Information

There are many references that you can consult for more information about JavaScript, though none appears to be truly comprehensive. A selection follows. For more links, see the Yahoo! JavaScript page (http://dir.yahoo.com/Computers_and_Internet/Programming_and_Development/Languages/JavaScript/).

For print books, try the Library of Congress subject heading JavaScript (Computer program language) or DHTML (Document markup language) in the library catalogue.


Home

Last updated April 20, 2007.
This page maintained by Prof. Tim Craven
E-mail (text/plain only): craven@uwo.ca
Faculty of Information and Media Studies
University of Western Ontario,
London, Ontario
Canada, N6A 5B7