1. Tech

Your suggestion is on its way!

An email with a link to:

http://javascript.about.com/library/bldom02.htm

was emailed to:

Thanks for sharing About.com with others!

The Javascript DOM

2. Collections

clr gif
Join the Discussion

Questions? Comments?

More of this Feature

Introduction

The very first browsers to provide Javascript access to the content of the web page document itself did so by providing access to collections of certain types of objects within the web page. The provision of these collections predates the earliest document object models added to Internet Explorer 4 and Netscape 4. These collections are still available in the most recent web browser versions and in some instances provide the easiest way to access those specific parts of the web page.

Here is a list of those collections that are available. In each case the collection is an array of the particular objects within the page that can either be accessed by number (with the entries being accessed in the order that they appear in the web page) or by name (if the objects have a name or id attribute that allocates them a name).

  • document.anchors is an array of all of the <a id="name"> containers in the page that are anchor points.
  • document.applets is an array of all of the <applet> containers in the page (deprecated).
  • document.embeds is an array of all of the <embed> containers in the page (deprecated).
  • document.forms is an array of all of the <form>s in the page.
  • document.images is an array of all of the <img>s in the page.
  • document.links is an array of all of the <a href="dest.htm"> containers in the page.

Probably the most useful of these collections are forms, images, and links (in that order). As there is usually only one form in a page document.forms[0] provides access to all of the fields within that form. Similarly the images and links collections provide easy access to interact with all of the images and links on the web page.

Of course these collections only give access to a small part of the page content. The standard document object model is slightly more complicated to code than these simple collection references but it provides access to every single part of the page (both HTML and stylesheets). We'll look at that in the following tutorials.

©2014 About.com. All rights reserved.