Objects

Methods

Event handlers

Property of

Examples

Example 1: an anchor. The following example defines an anchor for the text "Welcome to JavaScript".

If the preceding anchor is in a file called introd.html, a link in another file could define a jump to the anchor as follows:

Example 2: anchors array. The following example opens two windows. The first window contains a series of buttons that set location.hash in the second window to a specific anchor. The second window defines four anchors named "0", "1", "2", and "3". (The anchor names in the document are therefore 0, 1, 2, ... (document.anchors.length-1)). When a button is pressed in the first window, the onClick event handler verifies that the anchor exists before setting window2.location.hash to the specified anchor name.

LINK1.HTML, which defines the first window and its buttons, contains the following code:

LINK2.HTML, which contains the anchors, contains the following code:

See also

A pushbutton on an HTML form.

Syntax

To define a button:

<INPUT
   TYPE="button"
   NAME="buttonName"
   VALUE="buttonText"
   [onClick="handlerText"]>

To use a button object's properties and methods:

1. buttonName.propertyName
2. buttonName.methodName(parameters)
3. formName.elements[index].propertyName
4. formName.elements[index].methodName(parameters)

Description

A button object on a form looks as follows:

A button object is a form element and must be defined within a <FORM> tag.

The button object is a custom button that you can use to perform an action you define. The button executes the script specified by its onClick event handler.

Properties

Methods

Event handlers

Property of

Examples

The following example creates a button named calcButton. The text "Calculate" is displayed on the face of the button. When the button is clicked, the function calcFunction() is called.

See also

A checkbox on an HTML form. A checkbox is a toggle switch that lets the user set a value on or off.

Syntax

To define a checkbox, use standard HTML syntax with the addition of the onClick event handler:

<INPUT
   TYPE="checkbox"
   NAME="checkboxName"
   VALUE="checkboxValue"
   [CHECKED]
   [onClick="handlerText"]>
   textToDisplay

To use a checkbox object's properties and methods:

1. checkboxName.propertyName
2. checkboxName.methodName(parameters)
3. formName.elements[index].propertyName
4. formName.elements[index].methodName(parameters)

Description

A checkbox object on a form looks as follows:

A checkbox object is a form element and must be defined within a <FORM> tag.

Use the checked property to specify whether the checkbox is currently checked. Use the defaultChecked property to specify whether the checkbox is checked when the form is loaded.

Properties

Methods

Event handlers

Property of

Examples

Example 1. The following example displays a group of four checkboxes that all appear checked by default.

Example 2. The following example contains a form with three text boxes and one checkbox. The checkbox lets the user choose whether the text fields are converted to upper case. Each text field has an onChange event handler that converts the field value to upper case if the checkbox is checked. The checkbox has an onClick event handler that converts all fields to upper case when the user checks the checkbox.

See also

Lets you work with dates and times.

Syntax

To create a Date object:

1. dateObjectName = new Date()
2. dateObjectName = new Date("month day, year hours:minutes:seconds")
3. dateObjectName = new Date(year, month, day)
4. dateObjectName = new Date(year, month, day, hours, minutes, seconds)

To use Date methods:

dateObjectName.methodName(parameters)

Exceptions: The Date object's parse and UTC methods are static methods that you use as follows:

Date.UTC(parameters)
Date.parse(parameters)

Description

The Date object is a built-in JavaScript object.

Form 1 of the syntax creates today's date and time. If you omit hours, minutes, or seconds from form 2 or 4 of the syntax, the value will be set to zero.

The way JavaScript handles dates is very similar to the way Java handles dates: both languages have many of the same date methods, and both store dates internally as the number of milliseconds since January 1, 1970 00:00:00. Dates prior to 1970 are not allowed.

Properties

Methods

Event handlers

Property of

Examples

Contains information on the current document, and provides methods for displaying HTML output to the user.

Syntax

To define a document object, use standard HTML syntax:

<BODY
   BACKGROUND="backgroundImage"
   BGCOLOR="backgroundColor"
   TEXT="foregroundColor"
   LINK="unfollowedLinkColor"
   ALINK="activatedLinkColor"
   VLINK="followedLinkColor"
   [onLoad="handlerText"]
   [onUnload="handlerText"]>
</BODY>

To use a document object's properties and methods:

1. document.propertyName
2. document.methodName(parameters)

Description

An HTML document consists of a <HEAD> and <BODY> tag. The <HEAD> includes information on the document's title and base (the absolute URL base to be used for relative URL links in the document). The <BODY> tag encloses the body of a document, which is defined by the current URL. The entire body of the document (all other HTML elements for the document) goes within the <BODY> tag.

You can reference the anchors, forms, and links of a document by using the anchors, forms, and links arrays. These arrays contain an entry for each anchor, form, or link in a document.

Properties

Methods

Event handlers

Property of

Examples

The following example creates two frames, each with one document. The document in the first frame contains links to anchors in the document of the second frame. Each document defines its colors.

DOC0.HTML, which defines the frames, contains the following code:

DOC1.HTML, which defines the content for the first frame, contains the following code:

DOC2.HTML, which defines the content for the second frame, contains the following code:

See also

An array of objects corresponding to form elements (such as checkbox, radio, and text objects) in source order.

Syntax

1. formName.elements[index]
2. formName.elements.length

formName is either the name of a form or an element in the forms array.
index is an integer representing an object on a form.

Description

You can reference a form's elements in your code by using the elements array. This array contains an entry for each object (button, checkbox, hidden, password, radio, reset, select, submit, text, or textarea object) in a form in source order. For example, if a form has a text field and two checkboxes, these elements are reflected as formName.elements[0], formName.elements[1], and formName.elements[2].

Although you can also reference a form's elements by using the element's name (from the NAME attribute), the elements array provides a way to reference form objects programatically without using their names. For example, if the first object on the userInfo form is the userName text object, you can evaluate it in either of the following ways:

userInfo.userName.value
userInfo.elements[0].value

To obtain the number of elements on a form, use the length property: formName.elements.length. Each radio button in a radio object appears as a separate element in the elements array.

Elements in the elements array are read-only. For example, the statement formName.elements[0]="music" has no effect.

The value of each element in the elements array is the full HTML statement for the object.

Properties

Property of

Examples

See the examples for the name property.

See also

Lets users input text and make choices from form objects such as checkboxes, radio buttons, and selection lists. You can also use a form to post data to a server.

Syntax

To define a form, use standard HTML syntax with the addition of the onSubmit event handler:

<FORM
   NAME="formName"
   TARGET="windowName"
   ACTION="serverURL"
   METHOD=GET | POST
   ENCTYPE="encodingType"
   [onSubmit="handlerText"]>
</FORM>

NAME="formName" specifies the name of the form object.

TARGET="windowName" specifies the window that form responses go to. When you submit a form with a TARGET attribute, server responses are displayed in the specified window instead of the window that contains the form. windowName can be an existing window; it can be a frame name specified in a <FRAMESET> tag; or it can be one of the literal frame names _top, _parent, _self, or _blank; it cannot be a JavaScript expression (for example, it cannot be parent.frameName or windowName.frameName). Some values for this attribute may require specific values for other attributes. See RFC 1867 for details. You can access this value using the target property.

ACTION="serverURL" specifies the URL of the server to which form field input information is sent. This attribute can specify a CGI or LiveWire application on the server; it can also be a mailto: URL if the form is to be mailed. See the location object for a description of the URL components. Some values for this attribute may require specific values for other attributes. See RFC 1867 for details. You can access this value using the action property.

METHOD=GET | POST specifies how information is sent to the server specified by ACTION. GET (the default) appends the input information to the URL which on most receiving systems becomes the value of the environment variable QUERY_STRING. POST sends the input information in a data body which is available on stdin with the data length set in the environment variable CONTENT_LENGTH. Some values for this attribute may require specific values for other attributes. See RFC 1867 for details. You can access this value using the method property.

ENCTYPE="encodingType" specifies the MIME encoding of the data sent: "application/x-www-form-urlencoded" (the default) or "multipart/form-data". Some values for this attribute may require specific values for other attributes. See RFC 1867 for details. You can access this value using the encoding property.

To use a form object's properties and methods:

1. formName.propertyName
2. formName.methodName(parameters)
3. forms[index].propertyName
4. forms[index].methodName(parameters)

Description

Each form in a document is a distinct object.

You can reference a form's elements in your code by using the element's name (from the NAME attribute) or the elements array. The elements array contains an entry for each element (such as a checkbox, radio, or text object) in a form.

The forms array

You can reference the forms in your code by using the forms array (you can also use the form name). This array contains an entry for each form object (<FORM> tag) in a document in source order. For example, if a document contains three forms, these forms are reflected as document.forms[0], document.forms[1], and document.forms[2].

To use the forms array:

1. document.forms[index]
2. document.forms.length

index is an integer representing a form in a document.

To obtain the number of forms in a document, use the length property: document.forms.length.

You can also refer to a form's elements by using the forms array. For example, you would refer to a text object named quantity in the second form as document.forms[1].quantity. You would refer to the value property of this text object as document.forms[1].quantity.value.

Elements in the forms array are read-only. For example, the statement document.forms[0]="music" has no effect.

The value of each element in the forms array is <object nameAttribute>, where nameAttribute is the NAME attribute of the form.

Properties

The form object has the following properties:

The forms array has the following properties:

Methods

Event handlers

Property of

Examples

Example 1: named form. The following example creates a form called form1 that contains text fields for first name and last name. The form also contains two buttons that change the names to all upper case or all lower case. The function setCase shows how to refer to the form by its name.

If the form name is musicType, the alert displays the following message:

Example 3: onSubmit event handler. The following example shows an onSubmit event handler that determines whether to submit a form. The form contains one text object where the user enters three characters. The onSubmit event handler calls a function, checkData, that returns true if the number of characters is three; otherwise, it returns false. Notice that the form's onSubmit event handler, not the submit button's onClick event handler, calls the checkData function. Also, the onSubmit event handler contains a return statement that returns the value obtained with the function call.

Example 4: submit method. The following example is similar to the previous one, except it submits the form using the submit method instead of a submit object. The form's onSubmit event handler does not prevent the form from being submitted. The form uses a button's onClick event handler to call the checkData function. If the value is valid, the checkData function submits the form by calling the form's submit method.

See also

A window that can display multiple, independently scrollable frames on a single screen, each with its own distinct URL. Frames can point to different URLs and be targeted by other URLs, all within the same screen. A series of frames makes up a page.

Syntax

To define a frame object, use standard HTML syntax. The onLoad and onUnload event handlers are specified in the <FRAMESET> tag but are actually event handlers for the window object:

<FRAMESET
   ROWS="rowHeightList"
   COLS="columnWidthList"
   [onLoad="handlerText"]
   [onUnload="handlerText"]>
   [<FRAME SRC="locationOrURL" NAME="frameName">]
</FRAMESET>

To use a frame object's properties:

1. [windowReference.]frameName.propertyName
2. [windowReference.]frames[index].propertyName
3. window.propertyName
4. self.propertyName
5. parent.propertyName

Description

The <FRAMESET> tag is used in an HTML document whose sole purpose is to define the layout of frames that make up a page. Each frame is a window object.

If a <FRAME> tag contains SRC and NAME attributes, you can refer to that frame from a sibling frame by using parent.frameName or parent.frames[index]. For example, if the fourth frame in a set has NAME="homeFrame", sibling frames can refer to that frame using parent.homeFrame or parent.frames[3].

The self and window properties are synonyms for the current frame, and you can optionally use them to refer to the current frame. You can use these properties to make your code more readable. See the properties listed below for examples.

The top and parent properties are also synonyms that can be used in place of the frame name. top refers to the top-most window that contains frames or nested framesets, and parent refers to the window containing the current frameset. See the top and parent properties.

The frames array

You can reference the frame objects in your code by using the frames array. This array contains an entry for each child frame (<FRAME> tag) in a window containing a <FRAMESET> tag in source order. For example, if a window contains three child frames, these frames are reflected as parent.frames[0], parent.frames[1], and parent.frames[2].

To use the frames array:

1. [frameReference.]frames[index]
2. [frameReference.]frames.length
3. [windowReference.]frames[index]
4. [windowReference.]frames.length

frameReference is a valid way of referring to a frame, as described in the frame object.
windowReference is a variable windowVar from a window definition (see window object), or one of the synonyms top or parent.
index is an integer representing a frame in a parent window.

To obtain the number of child frames in a window or frame, use the length property:

[windowReference.].frames.length
[frameReference.].frames.length

Elements in the frames array are read-only. For example, the statement windowReference.frames[0]="frame1" has no effect.

The value of each element in the frames array is <object nameAttribute>, where nameAttribute is the NAME attribute of the frame.

Properties

The frame object has the following properties:

The frames array has the following properties:

Methods

Event handlers

Property of

Examples

The following example creates two windows, each with four frames. In the first window, the first frame contains pushbuttons that change the background colors of the frames in both windows.

FRAMSET1.HTML, which defines the frames for the first window, contains the following code:

FRAMSET2.HTML, which defines the frames for the second window, contains the following code:

FRAMCON1.HTML, which defines the content for the first frame in the first window, contains the following code:

FRAMCON2.HTML, which defines the content for the remaining frames, contains the following code:

FRAMCON3.HTML, which is referenced in a link object in FRAMCON1.HTML, contains the following code:

See also

A text object that is suppressed from form display on an HTML form. A hidden object is used for passing name/value pairs when a form submits.

Syntax

To define a hidden object:

<INPUT
   TYPE="hidden"
   NAME="hiddenName"
   [VALUE="textValue"]>

To use a hidden object's properties:

1. hiddenName.propertyName
2. formName.elements[index].propertyName

Description

A hidden object is a form element and must be defined within a <FORM> tag.

A hidden object cannot be seen or modified by a user, but you can programmatically change the value of the object by changing its value property. You can use hidden objects for client/server communication.

Properties

Methods

Event handlers

Property of

Examples

See also

Contains information on the URLs that the client has visited within a window. This information is stored in a history list, and is accessible through the Navigator's Go menu.

Syntax

To use a history object:

1. history.propertyName
2. history.methodName(parameters)

Description

The history object is a linked list of URLs the user has visited, as shown in the Navigator's Go menu.

Properties

Methods

Event handlers

Property of

Examples

Example 1. The following example goes to the URL the user visited three clicks ago in the current window.

Example 2. You can use the history object with a specific window or frame. The following example causes window2 to go back one item in its window (or session) history:

Example 3. The following example causes the second frame in a frameset to go back one item:

Example 4. The following example causes the frame named frame1 in a frameset to go back one item:

Example 5. The following example causes the frame named frame2 in window2 to go back one item:

See also

A piece of text or an image identified as a hypertext link. When the user clicks the link text, the link hypertext reference is loaded into its target window.

Syntax

To define a link, use standard HTML syntax with the addition of the onClick and onMouseOver event handlers:

<A HREF=locationOrURL
   [NAME="anchorName"]
   [TARGET="windowName"]
   [onClick="handlerText"]
   [onMouseOver="handlerText"]>
   linkText
</A>

You can also define a link using the link method.

To use a link object's properties:

document.links[index].propertyName

Description

Each link object is a location object and has the same properties as a location object.

If a link object is also an anchor object, the object has entries in both the anchors and links arrays.

When a user clicks a link object and navigates to the destination document (specified by HREF=locationOrURL), the destination document's referrer property contains the URL of the source document. Evaluate the referrer property from the destination document.

The links array

You can reference the link objects in your code by using the links array. This array contains an entry for each link object (<A HREF=""> tag) in a document in source order. For example, if a document contains three link objects, these links are reflected as document.links[0], document.links[1], and document.links[2].

To use the links array:

1. document.links[index]
2. document.links.length

index is an integer representing a link in a document.

To obtain the number of links in a document, use the length property: document.links.length.

Elements in the links array are read-only. For example, the statement document.links[0]="link1" has no effect.

Properties

The link object has the following properties:

The links array has the following properties:

Methods

Event handlers

Property of

Examples

Example 1. The following example creates a hypertext link to an anchor named javascript_intro.

Example 2. The following example creates a hypertext link to an anchor named numbers in the file DOC2.HTML in the window window2. If window2 does not exist, it is created.

Example 3. The following example takes the user back x entries in the history list:

Example 4. The following example creates a hypertext link to a URL. A set of radio buttons lets the user choose between three URLs. The link's onClick event handler sets the URL (the link's href property) based on the selected radio button. The link also has an onMouseOver event handler that changes the window's status property. As the example shows, you must return true to set the window.status property in the onMouseOver event handler.

Example 5: links array. The following example opens the Netscape home page in the newWindow window. The linkGetter() function uses the links array to display the value of each of its links.

See also

Contains information on the current URL.

Syntax

To use a location object:

[windowReference.]location.propertyName

Description

The location object represents a complete URL. Each property of the location object represents a different portion of the URL.

The following diagram of a URL shows the relationships between the location properties:

protocol//hostname:port pathname search hash

protocol represents the beginning of the URL, up to and including the first colon.
hostname represents the host and domain name, or IP address, of a network host.
port represents the communications port that the server uses for communications.
pathname represents the url-path portion of the URL.
search represents any query information in the URL, beginning with a question mark.
hash represents an anchor name fragment in the URL, beginning with a hash mark (#).

See the properties (listed below) for details about the different parts of the URL, or the href for examples.

The location object has two other properties not shown in the diagram above:

href represents a complete URL.
host represents the concatenation hostname:port.

The location object is contained by the window object and is within its scope. If you reference a location object without specifying a window, the location object represents the current location. If you reference a location object and specify a window name, for example, windowReference.location.propertyName, the location object represents the location of the specified window.

Do not confuse the location object with the location property of the document object. You cannot change the value of the location property (document.location), but you can change the value of the location object's properties (window.location.propertyName). document.location is a string-valued property that usually matches what window.location is set to when you load the document, but redirection may change it.

Syntax for common URL types

When you specify a URL, you can use standard URL formats and JavaScript statements. The following list shows the syntax for specifying some of the most common types of URLs.

The javascript: protocol evaluates the expression after the colon (:), if there is one, and loads a page containing the string value of the expression, unless it is undefined. If the expression evaluates to undefined, no new page loads.

The about: protocol provides information on Navigator and has the following syntax:

about:[cache|plugins]

Properties

Methods

Event handlers

Property of

Examples

Example 1. The following example sets the URL of the current window to the Netscape home page:

Example 2. The following example sets the URL of a frame named frame2 to the Sun home page:

See also the example for the anchor object.

See also

A built-in object that has properties and methods for mathematical constants and functions. For example, the Math object's PI property has the value of pi.

Syntax

To use a Math object:

1. Math.propertyName
2. Math.methodName(parameters)

Description

The Math object is a built-in JavaScript object.

You reference the constant PI as Math.PI. Constants are defined with the full precision of real numbers in JavaScript.

Similarly, you reference Math functions as methods. For example, the sine function is Math.sin(argument), where argument is the argument.

It is often convenient to use the with statement when a section of code uses several Math constants and methods, so you don't have to type "Math" repeatedly. For example,

with (Math) {
   a = PI * r*r
   y = r*sin(theta)
   x = r*cos(theta)
}

Properties

Methods

Event handlers

Property of

Examples

See the examples for the individual properties and methods.

Contains information about the version of Navigator in use.

Syntax

To use a navigator object:

navigator.propertyName

Description

Use the navigator object to determine which version of the Navigator your users have.

Properties

Methods

Event handlers

Examples

See the examples for the individual properties.

Property of

See also

A text field on an HTML form that conceals its value by displaying asterisks (*). When the user enters text into the field, asterisks (*) hide anything entered from view.

Syntax

To define a password object, use standard HTML syntax:

<INPUT
   TYPE="password"
   NAME="passwordName"
   [VALUE="textValue"]
   SIZE=integer>

To use a password object's properties and methods:

1. passwordName.propertyName
2. passwordName.methodName(parameters)
3. formName.elements[index].propertyName
4. formName.elements[index].methodName(parameters)

Description

A password object on a form looks as follows:

A password object is a form element and must be defined within a <FORM> tag.

Properties

Methods

Event handlers

Property of

Examples

See also

A set of radio buttons on an HTML form. A set of radio buttons lets the user choose one item from a list.

Syntax

To define a set of radio buttons, use standard HTML syntax with the addition of the onClick event handler:

<INPUT
   TYPE="radio"
   NAME="radioName"
   VALUE="buttonValue"
   [CHECKED]
   [onClick="handlerText"]>
   textToDisplay

To use a radio button's properties and methods:

1. radioName[index1].propertyName
2. radioName[index1].methodName(parameters)
3. formName.elements[index2].propertyName
4. formName.elements[index2].methodName(parameters)

Description

A radio object on a form looks as follows:

A radio object is a form element and must be defined within a <FORM> tag.

All radio buttons in a radio button group use the same name property. To access the individual radio buttons in your code, follow the object name with an index starting from zero, one for each button the same way you would for an array such as forms: document.forms[0].radioName[0] is the first, document.forms[0].radioName[1] is the second, etc.

Properties

Methods

Event handlers

Property of

Examples

Example 1. The following example defines a radio button group to choose among three music catalogs. Each radio button is given the same name, NAME="musicChoice", forming a group of buttons for which only one choice can be selected. The example also defines a text field that defaults to what was chosen via the radio buttons but that allows the user to type a nonstandard catalog name as well. The onClick event handler sets the catalog name input field when the user clicks a radio button.

Example 2. The following example contains a form with three text boxes and three radio buttons. The radio buttons let the user choose whether the text fields are converted to upper case or lower case, or not converted at all. Each text field has an onChange event handler that converts the field value depending on which radio button is checked. The radio buttons for upper case and lower case have onClick event handlers that convert all fields when the user clicks the radio button.

See also the example for the link object.

See also

A reset button on an HTML form. A reset button resets all elements in a form to their defaults.

Syntax

To define a reset button, use standard HTML syntax with the addition of the onClick event handler:

<INPUT
   TYPE="reset"
   NAME="resetName"
   VALUE="buttonText"
   [onClick="handlerText"]>

To use a reset object's properties and methods:

1. resetName.propertyName
2. resetName.methodName(parameters)
3. formName.elements[index].propertyName
4. formName.elements[index].methodName(parameters)

Description

A reset object on a form looks as follows:

A reset object is a form element and must be defined within a <FORM> tag.

The reset button's onClick event handler cannot prevent a form from being reset; once the button is clicked, the reset cannot be canceled.

Properties

Methods

Event handlers

Property of

Examples

Example 1. The following example displays a text object with the default value "CA" and a reset button with the text "Clear Form" displayed on its face. If the user types a state abbreviation in the text object and then clicks the Clear Form button, the original value of "CA" is restored.

Example 2. The following example displays two text objects, a select object, and three radio buttons; all of these objects have default values. The form also has a reset button with the text "Defaults" on its face. If the user changes the value of any of the objects and then clicks the Defaults button, the original values are restored.

See also

A selection list or scrolling list on an HTML form. A selection list lets the user choose one item from a list. A scrolling list lets the user choose one or more items from a list.

Syntax

To define a select object, use standard HTML syntax with the addition of the onBlur, onChange, and onFocus event handlers:

<SELECT
   NAME="selectName"
   [SIZE="integer"]
   [MULTIPLE]
   [onBlur="handlerText"]
   [onChange="handlerText"]
   [onFocus="handlerText"]>
   <OPTION VALUE="optionValue" [SELECTED]> textToDisplay [ ... <OPTION> textToDisplay]
</SELECT>

To use a select object's properties and methods:

1. selectName.propertyName
2. selectName.methodName(parameters)
3. formName.elements[index].propertyName
4. formName.elements[index].methodName(parameters)

To use an option's properties:

1. selectName.options[index1].propertyName
2. formName.elements[index2].options[index1].propertyName

Description

A select object on a form looks as follows. The object on the left is a selection list that lets the user choose one item; the object on the right is a scrolling list that lets the user choose one or more items:

A select object is a form element and must be defined within a <FORM> tag.

The options array

You can reference the options of a select object in your code by using the options array. This array contains an entry for each option in a select object (<OPTION> tag) in source order. For example, if a select object named musicStyle contains three options, these options are reflected as musicStyle.options[0], musicStyle.options[1], and musicStyle.options[2].

To use the options array:

1. selectName.options
2. selectName.options[index]
3. selectName.options.length

selectName is either the value of the NAME attribute of a select object or an element in the elements array.
index is an integer representing an option in a select object.

To obtain the number of options in a select object, use the length property of either the options array or the select object:

1. selectName.length
2. selectName.options.length

The select object has properties that you can access only through the options array. These properties are listed below.

Even though each element in the options array represents a select option, the value of options[index] is always null. The value returned by selectName.options represents the full HTML statement for the selectName object.

Elements in the options array are read-only. For example, the statement selectName.options[0]="guitar" has no effect.

Properties

The select object has the following properties:

The options array has the following properties:

Methods

Event handlers

Property of

Examples

Example 1. The following example displays a selection list and a scrolling list.

Example 2. The following example displays two selection lists that let the user choose a month and day. These selection lists are initialized to the current date. The user can change the month and day by using the selection lists or by choosing preset dates from radio buttons. Text fields on the form display the values of the select object's properties and indicate the date chosen and whether it is Cinco de Mayo.

See also the examples for the defaultSelected property.

See also

A series of characters.

Syntax

To use a string object:

1. stringName.propertyName
2. stringName.methodName(parameters)

Description

The string object is a built-in JavaScript object.

A string can be represented as a literal enclosed by single or double quotes; for example, "Netscape" or 'Netscape'.

Properties

Methods

Event handlers

Property of

Examples

The following statement creates a string variable.

See also

A submit button on an HTML form. A submit button causes a form to be submitted.

Syntax

To define a submit button, use standard HTML syntax with the addition of the onClick event handler:

<INPUT
   TYPE="submit"
   NAME="submitName"
   VALUE="buttonText"
   [onClick="handlerText"]>

To use a submit object's properties and methods:

1. submitName.propertyName
2. submitName.methodName(parameters)
3. formName.elements[index].propertyName
4. formName.elements[index].methodName(parameters)

Description

A submit object on a form looks as follows:

A submit object is a form element and must be defined within a <FORM> tag.

Clicking a submit button submits a form to the URL specified by the form's action property. This action always loads a new page into the client; it may be the same as the current page, if the action so specifies or is not specified.

The submit button's onClick event handler cannot prevent a form from being submitted; instead, use the form's onSubmit event handler or use the submit method instead of a submit object. See the examples for the form object.

Properties

Methods

Event handlers

Property of

Examples

The following example creates a submit object called submit_button. The text "Done" is displayed on the face of the button.

See also the examples for the form object.

See also

A text input field on an HTML form. A text field lets the user enter a word, phrase, or series of numbers.

Syntax

To define a text object, use standard HTML syntax with the addition of the onBlur, on Change, onFocus, and onSelect event handlers:

<INPUT
   TYPE="text"
   NAME="textName"
   VALUE="textValue"
   SIZE=integer
   [onBlur="handlerText"]
   [onChange="handlerText"]
   [onFocus="handlerText"]
   [onSelect="handlerText"]>

To use a text object's properties and methods:

1. textName.propertyName
2. textName.methodName(parameters)
3. formName.elements[index].propertyName
4. formName.elements[index].methodName(parameters)

Description

A text object on a form looks as follows:

A text object is a form element and must be defined within a <FORM> tag.

text objects can be updated (redrawn) dynamically by setting the value property (this.value).

Properties

Methods

Event handlers

Property of

Examples

Example 1. The following example creates a text object that is 25 characters long. The text field appears immediately to the right of the words "Last name:". The text field is blank when the form loads.

Example 2. The following example creates two text objects on a form. Each object has a default value. The city object has an onFocus event handler that selects all the text in the field when the user tabs to that field. The state object has an onChange event handler that forces the value to upper case.

See also the examples for the onBlur, onChange, onFocus, and onSelect event handlers.

See also

A multiline input field on an HTML form. A textarea field lets the user enter words, phrases, or numbers.

Syntax

To define a text area, use standard HTML syntax with the addition of the onBlur, onChange, onFocus, and onSelect event handlers:

<TEXTAREA
   NAME="textareaName"
   ROWS="integer"
   COLS="integer"
   [onBlur="handlerText"]
   [onChange="handlerText"]
   [onFocus="handlerText"]
   [onSelect="handlerText"]>
   textToDisplay
</TEXTAREA>

To use a textarea object's properties and methods:

1. textareaName.propertyName
2. textareaName.methodName(parameters)
3. formName.elements[index].propertyName
4. formName.elements[index].methodName(parameters)

Description

A textarea object on a form looks as follows:

A textarea object is a form element and must be defined within a <FORM> tag.

textarea objects can be updated (redrawn) dynamically by setting the value property (this.value).

To begin a new line in a textarea object, you can use a newline character. This character varies from platform to platform: Unix is \n, Windows is \r\n, and Macintosh is \n. One way to enter a newline character programatically is to test the appVersion property to determine the current platform and set the newline character accordingly. See the appVersion property for an example.

Properties

Methods

Event handlers

Property of

Examples

The following example creates a textarea object that is 6 rows long and 55 columns wide. The textarea field appears immediately below the word "Description:". When the form loads, the textarea object contains several lines of data, including one blank line.

See also the examples for the onBlur, onChange, onFocus, and onSelect event handlers.

See also

The top-level object for each document, location, and history object group.

Syntax

To define a window, use the open method:

windowVar = window.open("URL", "windowName" [,"windowFeatures"])

For details on defining a window, see the open method.

To use a window object's properties and methods:

 1. window.propertyName
 2. window.methodName(parameters)
 3. self.propertyName
 4. self.methodName(parameters)
 5. top.propertyName
 6. top.methodName(parameters)
 7. parent.propertyName
 8. parent.methodName(parameters)
 9. windowVar.propertyName
10. windowVar.methodName(parameters)
11. propertyName
12. methodName(parameters)

To define an onLoad or onUnload event handler for a window object, use the <BODY> or <FRAMESET> tags:

<BODY
   ...
   [onLoad="handlerText"]
   [onUnload="handlerText"]>
</BODY>

<FRAMESET
   ROWS="rowHeightList"
   COLS="columnWidthList"
   [onLoad="handlerText"]
   [onUnload="handlerText"]>
   [<FRAME SRC="locationOrURL" NAME="frameName">]
</FRAMESET>

For information on the <BODY> and <FRAMESET> tags, see the document and frame objects.

Description

The window object is the top-level object in the JavaScript client hierarchy. Frame objects are also windows.

The self and window properties are synonyms for the current window, and you can optionally use them to refer to the current window. For example, you can close the current window by calling either window.close() or self.close(). You can use these properties to make your code more readable, or to disambiguate the property reference self.status from a form called status. See the properties and methods listed below for more examples.

The top and parent properties are also synonyms that can be used in place of the window name. top refers to the top-most Navigator window, and parent refers to a window containing a frameset. See the top and parent properties.

Because the existence of the current window is assumed, you do not have to reference the name of the window when you call its methods and assign its properties. For example, status="Jump to a new location" is a valid property assignment, and close() is a valid method call. However, when you open or close a window within an event handler, you must specify window.open() or window.close() instead of simply using open() or close(). Due to the scoping of static objects in JavaScript, a call to close() without specifying an object name is equivalent to document.close().

You can reference a window's frame objects in your code by using the frames array. The frames array contains an entry for each frame in a window with a <FRAMESET> tag.

Windows lack event handlers until some HTML is loaded into them containing a <BODY> or <FRAMESET> tag.

Properties

Methods

Event handlers

Property of

Examples

In the following example, the document in the top window opens a second window, window2, and defines pushbuttons that open a message window, write to the message window, close the message window, and close window2. The onLoad and onUnload event handlers of the document loaded into window2 display alerts when the window opens and closes.

WIN1.HTML, which defines the frames for the first window, contains the following code:

WIN2.HTML, which defines the content for window2, contains the following code:

See also the example for the frame object.

See also