William M. Pegram
Home | Courses | Web Design | Office | Client-Side Scripting | Server-Side Scripting | About Me

Java and JavaScript

Revised: April 29, 2000

Java and JavaScript are two programming languages that are used with web pages.  Both have similar syntax and both are typically used as client-side, as opposed to server-side, applications, which means in this case that they run in the browser.   Java was originally developed by Sun Microsystems.  To use a Java program in a web page, the web page uses an <APPLET> tag which "calls" the Java program and can pass parameters to the Java program.  The statements in the Java program are not visible to the user. 

Java seems to be pretty rare in web pages, whereas JavaScript, originally developed by Netscape, seems to be pretty common -- my guess is that is may be used in a third to half of professional web sites.  The popularity of JavaScript vis a vis Java in web pages probably arises from several factors:

Because of the greater popularity of JavaScript for use in web pages, I will here focus only on JavaScript.  I will only talk about client-side applications.  This section draws from David Flanagan's book on JavaScript described in the references.

Capabilities of JavaScript

JavaScript Syntax

Primary Places that JavaScript Code will Appear:

JavaScript is executed in the order it appears in the HTML.  The JavaScript to define functions typically appears between <SCRIPT> and </SCRIPT> tags which are located between the <HEAD> and </HEAD> tags.  Such placement of functions has several advantages.  First, all statements in the <HEAD> are executed before statements in the body -- placing the function in the head means that if the function is called from the body that the function will be defined.  Second, placing the function definition in the head protects against inadvertent erasure of the JavaScript when using an HTML editor.

Code Samples

1) Browser detection:

 if ((navigator.appName == 'Netscape') 
    && (parseInt(navigator.appVersion) >=4)) netscape4=true;

Browser detection is used because of Netscape and Internet Explorer incompatibilities and the more limited capabilities of earlier versions of browsers.  An alternative way handle this problem in some cases is to use the language attribute of the <SCRIPT> tag.

2) Status line message: <a href="mozart.html" onMouseOver="window.status='A study of Mozart's operas';
return true;">Mozart</a>

The principal problem with changing the status line is that one loses the information that normally appears there, such as the address of a link.

3) Image Mouseover effect: <A HREF="#" onMouseOver="document.home.src='../Images/next.gif';"
onMouseOut="document.home.src='../Images/prev.gif';">
<IMG BORDER=0 NAME="home" SRC="../Images/prev.gif"></a>

In this example, the Images object of the Document object is accessed via the name "home" and the src property of the image object is read/write, thereby allowing the replacement of one image by another when the mouse is over the link and another replacement when the mouse is removed.

Examples of image mouseovers: Navigation bar at top of NOVA Home Page at www.nvcc.edu.   One typically wants the alternative image to be preloaded, so that there is no delay in the effect.  One way to do this is to display the alternative image somewhere else in the same page or in a splash page with HEIGHT and WIDTH attributes of 1 pixel each, so that it is essentially invisible.

Comments to William Pegram, wpegram@nvcc.edu