Suppose we have a board of 300 identical squares, where each square is represented as an IMG tag. We can start building the document's object hierarchy by first creating a master IMG object:

var squareNode = document.createElement("IMG");

And then by cloning it the number of times needed to fill the board:

tempSquareNode = squareNode.cloneNode();

We hook up these cloned objects to their proper father via the appendChild() method:

divNode.appendChild(tempSquareNode);

Learn how to build a DOM-Based Snakes Game in Column 46, A DOM-Based Snakes Game, Part I .

People who read this tip also read these tips:

• Deleting DOM Substrings
• Zooming In and Out On Line
• Positioning Popup Windows
• Appending DOM Strings
• Establishing Parent-Child Connections