Outer Court

Tech - DOM/ DHTML

The discussed samples work in IE5+ and therefore are only of use in experimental pages in the WWW (like games) or in intranets with a standardized browser. This isn't a tutorial but rather my collected code for reference purposes if you already know basic DOM/ DHTML.
Sample pages have self-contained styles and code. View them in IE5 or right-click-save them directly to disk.

Basics

Change class

Change the class of an element:

elm = bodyNode; // object pointer
elm.className = "myClass";



In the CSS we assigned a style to that class:

.myClass { color: red }



Samplefile changeclass.htm

Create page element

Assign an empty "div"-element to object "bodyNode":

elm = document.createElement ( "DIV" );
bodyNode.appendChild ( elm );



Samplefile createelement.htm

Show source

Here's the source HTML from inside the "bodyNode":


  alert ( bodyNode.innerHTML );




"innerHTML" (note the upper-case HTML) is a non-standardized way of altering HTML content, already available in IE4.

 
Basic
Goodies
Design
Tech
Email
Make a donation