html code is formatted by tags. these tags represent elements, that can have
attributes. in html elements can or have to contain further elements. that way
you come to a nestled code structure as you can see in the following example.
<table width="800" border="0" cell padding="0" cellspacing="0">
<tr>
<td height="98">
</td>
<td width="722" height="98" class="leftborder">
<ahref="index.html">
<img src="../images/texone_org.gif" width="191" height="40" border="0">
</a><br><br>
<strong>
<a href="index.html">
tree
</a>
::
<a href="tools.htm">
description
</a>
::
<a href="sound.htm">
sound
</a>
::
<a href="ctm.htm">
comments
</a>
</strong>
</td>
</tr>
this code structure is similar to that of a tree. a tree structure is described
by nodes these nodes have different numbers of children, if a node does not
have a children it is a leave. in the code example is a table tag <table
width="800" border="0" cellpadding="0" cellspacing="0"> this
table tag has one child a tr tag. the tr tag has two td tags as children and
so on. this tree structure in the html code is the base for the tree visualization.
to get the tree structure of the html page it has to be parsed. so what does
that mean? the html code itself is just a text file. for the tree structure
now this text file is read char by char by a parser. every time the parser
finds an opening bracket of a tag, a new object gets initialized and the attributes
are added. after finishing parsing a tag the parser looks for child elements,
which are add if existent. text is treated like an element. a peace of text
is separated into words. when the parser finds color attributes they are put
into an extra list, so they can be used for visualization later.
after the parsing process tree has put the tree structure of the code, into
linked memory cells of the computer. in this moment a tree is really existent
not only virtually but also physically in the memory of the computer. the painting
part of the program now takes the content from the memory. it starts at the
memory cell corresponding to the first tag in the html page, then it accesses
its children proceeding until everything is visualized.
|
