Back to Syllabus

Using Javascript

JavaScript is a programmable API that allows cross-platform scripting of events, objects, and actions. It allows the page designer to access events such as startups, exits, and users' mouse clicks. JavaScript extends the programmatic capabilities of Netscape Navigator (and to a slightly lesser extent, Microsoft's Internet Explorer) to a wide range of authors, and is easy enough for anyone who can compose HTML.

Embedding JavaScript into a HTML-page

JavaScript code is embedded directly into the HTML page. In order to see how this works we are going to look at an easy example:

<HTML>
<BODY>
<BR>
This is a normal html document
<script language="JavaScript"
document.write ("This is JavaScript!")
</SCRIPT>
<BR>
Back in HTML again.
</BODY>
</HTML>

At the first glance this looks like a normal HTML file. The only new thing is the part:

The script looks like this:

<script language="JavaScript"> document.write("This is JavaScript!")
</SCRIPT>

This is JavaScript. In order to see this script working save this code as a normal HTML file and load it into your browser. Here is the output generated by the file:

This is a normal HTML document.
This is JavaScript!
Back in HTML again.

I must admit that this script isn't very useful - this could have been written in pure HTML more easily. I only wanted to demonstrate the <SCRIPT> tag is interpreted as JavaScript code and how to imbed these scripts into an html page. So our little JavaScript program writes the text This is JavaScript! to the HTML-document.

Why you don't have to know how to write JavaScript to use JavaScript.

If you would like to learn how to write javascript try the following tutorials:

But... you don't have to know how to write JavaScript or use JavaScript, there are many JavaScript libraries available on the web. All you have to do is cut and paste and know which variables might need to be changed. Check out a few of these libraires:

Here are a few examples:

The statusbar

JavaScript programs can write to the statusbar - this is the bar at the bottom of your browser window. All you have to do is to assign a string to window.status. The following example shows you two buttons which can be used to write to the statusbar and to erase the text again.

The script looks like this: embed the following in the <HEAD> element

<script language="JavaScript"
<!--
hide function statbar(txt) { window.status = txt; } -->
</SCRIPT>

And the following in the <body> of the document where you want he buttons to appear:


<FORM>
<input type="button" name="look" value="Write!" onClick="statbar('Hi! This is the statusbar!');">
<input type="button" name="erase" value="Erase!" onClick="statbar('');">
</FORM>

You can change what appears in bold in the <form> to customize this script.

Navigational Elements

Drop Down Navigation Click here for script.

do you want to ... do it!

Another Pull down menu. Click here for the script.

 

Time and Date. Click here for the script.


Static Menu Script.
Click here to see an example.
Click here to get the script

Slide Show

JavaScript Cross-Browser SlideShow Script With Adjustable Timing and Unlimited Images Function: Displays images continuously in a slideshow presentation format