JavaScript: History
Placement
Events

History

Netscape developed a language to add more control to pages and called it LiveWire. They got together with Sun who was developing Java at the time. They decided to call the new language JavaScript even though it and Java are very different. In response, Microsoft introduced a version of Visual Basic called VBScript. They also made a slightly different version of JavaScript and called in JScript. The standard version of the language is called ECMAScript.

Whatever the name, the new language added dynamic control over elements on the page. This is a very important part of web page design. HTML describes the structure and overall layout of the page. CSS controls the appearance and detailed layout. JavaScript provided form validation, mouse controls and interactivity. Java provides database access and complete interactivity.

Placement

JavaScript code goes in between special tags in HTML.

<script language="JavaScript" src="url">
</script>
Other values are possible for the language attribute but they will probably limit where your page and code can be used. These tags could be put anywhere but are generally put in the head section. Sometimes you put the script tags in the body to run some JavaScript code that will generate output to alter the appearance of the page. A good habit, (but it is less needed every day) is to hide the actual JavaScript code from older browsers that don't support it. You do this by putting HTML comments inside the script tags. Like this.
<script language="JavaScript" src="url">
<!-- start of HTML comment all of you JavaScript code --> </script>
This is only really needed to support what are now very old browsers.

Events

There are a lot of common events in the browser. These are just things that happen, like mouse moves, mouse clicks, a page is loaded or unloaded, values in form fields change. They are given names like onClick or onChange. You can tell the browser that whenever a certain event occurs, you want some JavaScript to be run. You do this by using attributes on HTML tags. Here is an example where I want to do something when a button is pressed.

The onChange event is part of a form element like a text box or area. Whenever a user enters something and then clicks outside the box, tabs to the next field or hits return, this event is triggered.

Objects are nested like boxes in the display. So, any form you might have would be inside the document. And form elements are inside the form. Forms are easy to use in JavaScript since you can refer to a form object just be using its name. So if the form is named "addressform" and the text box is named "fname", you can refer to is like this.

document.addressform.fname
The most important property of a text box is its value. So the value can be printed like this.
document.write(document.addressform.fname.value);