Dynamic Content in Internet Explorer 4: The New Properties | WebReference

Dynamic Content in Internet Explorer 4: The New Properties


Dynamic Content in IE4:
the new properties for replacing and deleting text and HTML

With Apologies to Charlie

To best demonstrate the use of the new properties, we will use this piece of HTML:

    <BLOCKQUOTE ID="quote"> It was the <B ID="goodTimes"><I>best</I></B> of times, it was the <B ID="badTimes">worst</B> of times, it was the age of wisdom, it was the age of foolishness...</BLOCKQUOTE>

which, when parsed, renders:

It was the best of times, it was the worst of times, it was the age of wisdon, it was the age of foolishness...

The second named element in the above passage is goodTimes, assigned to a B tag.

This element can be referenced as:

As we know, the all collection of the document object contains all the elements in a page. For this reason, it is redundant as a reference. When dealing with cross-browser code, it is usually maintained to allow for comparison with Navigator's document object. Since this is IE-specific code, we'll do away with it. Thus, the first element can be simply referenced as goodTimes, and the four properties in question as:
    goodTimes.innerText goodTimes.outerText goodTimes.innerHTML goodTimes.outerHTML

These properties have the following string values:

(The example again: the <B ID="goodTimes"><I>best</I></B> of times,)

- "best" (text within element) goodTimes.outerText - "best" (text including element tags) goodTimes.innerHTML - "<I>best</I>" (HTML within element) goodTimes.outerHTML - "<B ID="goodTimes"><I>best</I></B>" (HTML including element tags)

The values of these properties can be both retrieved and set. That is, they are read/write properties.

Notice that innerText and outerText have the same value. All HTML has been stripped, as the "text" properties see only the non-HTML text..

Assigning a string value to any of these properties through a script will cause the page to be immediately updated to accomodate the changes.


We now know how these properties obtain their initial values. We can, however, change these values at will

Produced by Peter Belesis and

All Rights Reserved. Legal Notices.
Created: 09/24/97
Revised: 09/28/97

URL: http://www.webreference.com/dhtml/column5/inANDout.html