Engineering College of Copenhagen Menu Department of Electronics and Information Technology

JavaScript

JavaScript is a language for programs that run on the client side - i.e. in the user's browser. This language resembles Java, but is not the same.

With JavaScript you can make your web page respond immediately to anything the user does, even the smallest movement of the mouse, and it is possible to modify anything anywhere on the web page. For example, you can make text or images appear, disappear, change or move anywhere on the web page.

The syntax of the JavaScript language itself is standardized and works in many browsers, but there are very big compatibility problems when it comes to modifying things on a web page. This is because you have to use a Document Object Model (DOM) for naming or addressing the text or image you want to modify, and the DOM is not standardized. Netscape and Explorer each have their own DOM. The obvious need for standardization has led the independent World Wide Web Consortium (W3C) to define a new standard W3C-DOM. Netscape version 5, which is in beta-test at the time of writing (summer 2000) supports the new W3C-DOM. If you want to make a web page that uses JavaScript for modifying text or images then you have to make four different versions of your code: one for Netscape-DOM, one for Explorer-DOM, one for W3C-DOM, and one for browsers that have no support for JavaScript and DOM. Furthermore, you need a browser-sniffer for detecting which code is needed. The animation on the animations page uses this method. 

This is so complicated that you should consider running your code at the server side rather than the browser side to make it independent of the browser.

Below are a few examples of JavaScript code that works in most browsers.

Examples:

1. drop-down menu

<SCRIPT LANGUAGE="JavaScript">
<!--
   function jump(sel) { // jump to listbox selection
      var url = sel.options[sel.selectedIndex].value;
      if(url) {
         window.location = url;}}
// --> 
</script>
<form name='menu1'>
   <select name='dest1' size=1 onChange='jump(this.form.dest1)'>
      <option selected value=''>Menu</option>
      <option value='page1.htm'>Page 1</option>
      <option value='page2.htm'>Page 2</option>
      <option value='page3.htm'>Page 3</option>
   </select>
</form>
<NOSCRIPT>  <!-- This is for browsers that don't support JavaScript: -->
   <a href='page1.htm'>Page 1</a><br>
   <a href='page2.htm'>Page 2</a><br>
   <a href='page3.htm'>Page 3</a>
</NOSCRIPT>

Explanation:

This JavaScript code makes a drop-down menu that jumps to the page selected by calling the function jump.

It will look like this:

 

2. Back button

<form>
  <input type="button" value="Back" OnClick="history.go(-1)">
</form>

Explanation:

The JavaScript statement history.go(-1) is called when the button is clicked.

It will look like this:

This page was last modified 2008-Dec-08

← Previous↑ Index