December 1, 2000 - Modifying Options on the Fly | WebReference

December 1, 2000 - Modifying Options on the Fly

Yehuda Shiran December 1, 2000
Modifying Options on the Fly
Tips: December 2000

Yehuda Shiran, Ph.D.
Doc JavaScript

One of the advantages of Netscape 6 over Internet Explorer is its better support of the DOM for certain objects. One of this objects is the SELECT element. Both browser supports the un intuitive way of looping through the option objects with the item() method, but only Netscape 6 lets you access the options of the SELECT object as any other elements in the DOM. The following drop-down menu includes two entries, Al Gore and George W. Bush. Here is the HTML code for this menu:

<FORM NAME="election">
<SELECT NAME="presidents">
<OPTION NAME="leaving">Al Gore
<OPTION SELECTED>George W. Bush
</SELECT>
</FORM>

The button on the right hand side has the following event handler:

onclick="document.election.leaving.text = 'Bill Clinton'";

Examine carefully the two menu options: Al Gore and George W. Bush. Click the button. In Internet Explorer, you will get an error message, complaining about the object not found. In Netscape 6, on the other hand, the first option will be changed to "Bill Clinton".

Read more about the DOM in Columns 40, The DOM, Part I: Analysis, through 47, A DOM-Based Snakes Game, Part II.