Note how we got to the value of the element of the
form object-by going down the JavaScript object tree. Try altering the text
in the text box, and try clicking above again. You will see that it will
alert the new entry each time.

Ok, so whenever you create a form, always remember to give
both the form and the element a distinct name in which JavaScript can then
acquire to access the element. Is this the only way? No. You could use
arrays, but I will not talk about that in this section; this is generally
the better way to access forms in that it will not confuse you by asking you
to keep track of each form element using its index number.

Lets do an illustration with multiple boxes.

Basic Calculator-Enter a math expression in the
first box, and than use the calculate button to get the answer. Ex: 25*(6-5)

Basically, we are saying: put whatever
is in the right-hand-side, and stuff it into the left hand side. Hay, but
wait! What is eval(...) in the
above? It is a built in function that "evaluates" what's in the first box
before stuffing it into the second one. eval(something) is a built
in function that "makes sense" of any string you put into it,
treating it as code instead of a string. Consider this:

document.example.answer.value=document.example.calculator.value

If we type: (3*5)+7
Without eval(): "(3*5)+7"
With eval(): 22

Don't expect to understand fully the eval() function right
now...just understand its role in this example. We will come back to this
function, because its such an important one; in the mean time, don't worry
about it. Now, there is one small problem with this example: Try inputting
letters (ie: l*we) into it, and you will get an error message. That's
because, of course, you cannot calculate letters, but your code does not
know that! It attempts to, and out pops JavaScript errors-we shall discuss
validating forms in the next page.

Finally, lets do a more complex example that has a little
more practicality to it. You may have seen the below example used on the
net:

As you can see, we used the event handers we had learned
before to give the textarea box different text, depending on the state of
the mouse. When the mouse moves over it, we supply the box with the text we
want it to display, and when it moves out, we reset it. Note that resetting
it is by giving it a value of null, or ''