spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / programming / professional / chap6/ 2 To page 1To page 2To page 3current pageTo page 5To page 6To page 7To page 8To page 9
[previous] [next]

The Web Professional's Handbook: Document Object Models

Service Release Technical Architect Sr (PA)
Next Step Systems
US-PA-Philadelphia

Justtechjobs.com Post A Job | Post A Resume
Developer News
OpenOffice 3.2 Lands Amid Critical Changes
Red Hat, IBM Firmly in KVM Virtualization Camp
Red Hat Talks Up Open Source Cloud Plans


Netscape DOM

While Microsoft's DOM is progressive and fairly easy to use, the Netscape DOM isn't. It's a very complicated set of rules and, even when you apply them perfectly, you can still encounter weird problems.

The Netscape DOM is supported by Netscape 4. However, the Mozilla project, which produces the code engine for Netscape 6+, has decided to completely remove the Netscape DOM since it was unworkable. Escape and Omniweb also support the Netscape DOM.

The Netscape DOM is founded on the layer object. A layer is a separate part of an HTML page that sometimes acts as a separate page altogether. You can change a few of its styles, notably for moving the layer or making it invisible. It's also possible to load a separate HTML page into a layer, though this is rarely done.

Netscape 4 also introduced a <layer> tag, but using it is not a very good idea. No other browser supports it: not even Netscape 6. Besides, using this tag is not necessary, since layer objects are also created by elements that have their position set to absolute or relative.

Let's take our DHTML example code from above:

<div id="testdiv" style="
     position: absolute;
     top: 50px;
     left: 50px;
     font: 12px verdana;
     border: 1px solid #000000;">
  This is the test DIV<br />
  <a href="javascript:changeIt()">Change</a> its position
</div>

Since this <div> is positioned absolutely, Netscape 4 counts it as a layer. It's then possible to move it, just like we did in the other DOMs. We can get the layer by id and then change its left property. Note however, that the Netscape DOM doesn't know the style property.

Theoretically, our code would become:

function changeIt() // Netscape DOM
{
  document.layers['testdiv'].left = 0;
  document.layers['testdiv'].position = 'relative';
  document.layers['testdiv'].font = '20px verdana,arial,helvetica';
  document.layers['testdiv'].textAlign =  'right';
}

However, if you try this you'll immediately notice that Netscape 4 only executes the changing of the left style. All other style changes are ignored. Netscape 4 simply can't handle them.


Property

Read/write

Description

background.src

read/write

The source of the background image.

bgColor

read/write

The background color.

clip

read/write

The clipping of the layer. Contains clip.top, clip.bottom, clip.left, clip.right, clip.height, and clip.width.

document

read-only

The document inside the layer. This is necessary whenever you want to access an HTML element within the layer (a form or an image, for instance).

left

read/write

The left position of the layer.

src

read/write

The source of the layer. By changing this property, you can load another page into the layer.

top

read/write

The "top"position of the layer

visibility

read/write

The visibility of the layer. This takes four values: show and hide or, equivalently, visible and hidden. When reading out the visibility value, Netscape 4 always returns show or hide.

zIndex

read/write

The z-index of the layer.

These properties are the only style properties that can be changed in Netscape 4. Changing any other style simply won't work. Even when you change the properties mentioned in this table, you may find that the effect sometimes won't work or works strangely.

Layers as Separate Documents

Netscape 4 treats layers as separate documents. So, to access elements inside a layer, you must first access the layer object itself. For instance, to access the link in the <div>, a simple reference to:

document.links[0]

should be enough. After all, it is the first (and only) link in the document. But in Netscape 4, this DOM reference doesn't work. It considers the link to be inside the layer. Therefore you must access it as the first link in the document in the layer with id="testdiv". Thus, to access the link, you need this code:

document.layers['testdiv'].document.links[0]

This also goes for images and forms, and even for other layers.


home / programming / professional / chap6/ 2 To page 1To page 2To page 3current pageTo page 5To page 6To page 7To page 8To page 9
[previous] [next]


The Network for Technology Professionals

Search:

About Internet.com

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | E-mail Offers

webref The latest from WebReference.com Browse >
Search Engine Optimization: Selecting and Embedding Keywords · Are Google's Language Translation Web Services Ready for Prime Time? · Installing and Using Meeplace, the Business Review CMS
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
IBM DB2 10 for z/OS: Justifying the Upgrade · Living La Vida Colo: Choosing the Right Colocation Facility · FTC Concerns over Social Media Privacy Linger

Created: March 11, 2003
Revised: March 28, 2003

URL: http://webreference.com/programming/professional/chap6/2