ITP

ITP - JavaScript

Chapter 4: Browser and Document Objects

When to use JavaScript
- Data entry validation
- Server-less CGIs
- Dynamic HTML interactivity
- CGI prototyping
- Offloading a busy server
- Adding life to otherwise dead pages
- Creating "Web pages that think"
The Document Object Model
Containment Hierarchy
Object References
- Object naming
  Examples:
```
<FORM NAME="dataEntry" METHOD=GET>
<INPUT TYPE="text" NAME="entry">
< FRAME SRC="info.html" NAME="main">
```
- Naming rules:
  1. May not contain space
  2. May not contain punctuation except for the underscore
  3. Must be inside quotes when assigned t the NAME attribut
  4. Must not start with a numberic character
Dot Syntax

window <HTML>

window.document <BODY>Hello World

window.document.formName <FORM>

window.document.formName.textName
window.document.formName.buttonName

<INPUT TYPE="text">
<INPUT TYPE="button">
</FORM>
</BODY>
</HTML>

What Defines an Object?

Properties

<FORM NAME="input">
	document.input.name --> "input"

<INPUT TYPE="button" NAME="clicker" VALUE="Click this...">
	document.input.clicker.name  --> "clicker"
	document.input.clicker.value --> "Click this..."
	document.input.clicker.type  --> "button"

<INPUT TYPE="text" NAME="textField" VALUE="Enter your name:">
	document.input.textField.name  --> "textField"
	document.input.textField.value --> "Enter your name"
	document.input.textField.type  --> "text"

Methods

document.write("  ==>Written by the document method: write()");
document.input.textField.select();

Event handlers

<INPUT TYPE="button" NAME="button" VALUE="button" onClick="window.alert('This is an alert box')">

Ichiro Fujinaga 1998.09.10

window	<HTML>
window.document	<BODY>Hello World
window.document.formName	<FORM>
window.document.formName.textName window.document.formName.buttonName	<INPUT TYPE="text"> <INPUT TYPE="button"> </FORM> </BODY> </HTML>