Section 25.133. Form.elements: the input elements of a form

25.133. Form.elements[]: the input elements of a form

DOM Level 2 HTML

25.133.1. Synopsis

readonly HTMLCollection elements

25.133.2. Description

elements[] is an array-like HTMLCollection of the form elements (such as Input, Select, and Textarea objects) that appear in an HTML form. The elements of the array are in the same order they appear in the HTML source code for the form. Each element has a type property whose string value identifies its type.

25.133.3. Usage

If an item in the elements[] array has been given a name with the name=" name " attribute of its HTML <input> tag, that item's name becomes a property of form , and this property refers to the item. Thus, it is possible to refer to input elements by name instead of by number:



form.name

25.133.4. See Also

Input , HTMLCollection , Select , Textarea

25.134. Form. onreset : event handler invoked when a form is reset

DOM Level 0

25.134.1. Synopsis

Function onreset

25.134.2. Description

The onreset property of a Form object specifies an event-handler function that is invoked when the user clicks on a Reset button in the form. Note that this handler is not invoked in response to the Form.reset( ) method. If the onreset handler returns false , the elements of the form are not reset. See Element.addEventListener( ) for another way to register event handlers.

25.134.3. See Also

Element.addEventListener( ) , Form.onsubmit , Form.reset( ) ; Chapter 17

25.135. Form.onsubmit: event handler invoked when a form is submitted

DOM Level 0

25.135.1. Synopsis

Function onsubmit

25.135.2. Description

The onsubmit property of a Form object specifies an event-handler function that is invoked when the user submits a form by clicking on its Submit button. Note that this event handler is not invoked when the Form.submit( ) method is called.

If the onsubmit handler returns false , the elements of the form are not submitted. If the handler returns any other value or returns nothing, the form is submitted normally. Because the onsubmit handler can cancel form submission, it is ideal for performing form data validation.

See Element.addEventListener( ) for another way to register event handlers.

25.135.3. See Also

Element.addEventListener( ) , Form. onreset , Form.submit( ) ; Chapter 17

25.136. Form.reset( ): reset the elements of a form to their default values

DOM Level 2 HTML

25.136.1. Synopsis

void reset( );

25.136.2. Description

This method resets each element of a form to its default value. The results of calling this method are like the results of a user clicking on a Reset button, except that the onreset event handler of the form is not invoked.

25.136.3. See Also

Form.onreset , Form.submit( )

25.137. Form.submit( ): submit form data to a web server

DOM Level 2 HTML

25.137.1. Synopsis

void submit( );

25.137.2. Description

This method submits the values of the form elements to the server specified by the form's action property. It submits a form in the same way that a user 's clicking on a Submit button does, except that the onsubmit event handler of the form is not triggered.

25.137.3. See Also

Form.onsubmit , Form.reset( )

25.138. Frame: a <frame> in an HTML document

DOM Level 2 HTML: Node Element HTMLElement Frame

25.138.1. Properties

As explained in the Description, HTML frames can be accessed as Frame objects or as Window objects. When accessed as Frame objects, they inherit properties from HTMLElement and define these additional properties:

Document contentDocument: The document that holds the content of the frame.
String src: The URL from which the frame's content was loaded. Setting this property causes the frame to load a new document. This property simply mirrors the src attribute of the HTML <frame> tag: it is not a Location object like Window.location .

In addition to these properties, the Frame object also defines the following properties, which correspond directly to HTML attributes:

Property	Attribute	Description
`String frameBorder`	`frameborder`	Set to "0" for borderless frames
`String longDesc`	`longdesc`	The URL of a frame description
`String marginHeight`	`marginheight`	Top and bottom frame margin, in pixels
`String marginWidth`	`marginwidth`	Left and right frame margin, in pixels
`String name`	`name`	The name of the frame, for DOM Level 0 lookup and form and link targets
`boolean noResize`	`noresize`	If `true` , user cannot resize frame
`String scrolling`	`scrolling`	Frame scroll policy: "auto", "yes", or "no"

25.138.2. Description

Frames have a dual nature and may be represented in client-side JavaScript by either Window or Frame objects. In the traditional Level 0 DOM, each <frame> is treated as an independent window and is represented by a Window object, referenced by name, or as an element of the frames[] array of the containing Window:

// Get a frame as a Window object
var win1 = top.frames[0];     // Index frames[] array by number
var win2 = top.frames['f1'];  // Index frames[] array by name
var win3 = top.f1;            // Get frame as a property of its parent

When frames are looked up this way, the returned object is a Window, and the properties listed in the previous section are not available. Instead, use Window properties, such as document to access the frame's document and location to access the URL of that document.

In the Level 2 DOM, <frame> elements can be looked up by ID or tag name, just as any other document element can be:

// Get a frame as a Frame object
var frame1 = top.document.getElementById('f1');               // by id
var frame2 = top.document.getElementsByTagName('frame')[1];   // by tag name

When frames are looked up using DOM methods like these, the result is a Frame object rather than a Window object, and the properties listed previously are available. Use contentDocument to access the frame's document, and use the src property to query the URL of that document or to make the frame load a new document. To obtain the Window object of a Frame object f , use f.contentDocument.defaultView .

<iframe> elements are very similar to <frame> elements. See the IFrame reference page.

Note that the same-origin policy (see Section 13.8.2) applies to multiframed documents. Browsers do not allow you to access the content of frames loaded from a different origin than that of the content that includes the script. This is true whether the frame is represented by a Window or a Frame object.