Tree Builder Examples
Import
All examples require:
tb = Html5TreeBuilder()
Render
Assuming the tree starts at doc, render the tree by:
Attributes
Most elements take attributes though not all attributes are valid for all elements.
Elements should have only one instance on any attribute. They are passed in a dictionary.
produces:
For some popular HTML5 tags:
tb.pre("this is text")
tb.table(tb.tr(tb.th("Name"), tb.th("Age")), tb.tr(tb.td("Bill"), tb.td("23")))
produces:
<pre>this is text</pre>
<table><tr><th>Name</th><th>Age</th></tr><tr><td>Bill</td><td>23</td></tr></table>
Almost all elements can take the id attribute. The value of an id attribute should only exist once in a document.
produces:
Almost all elements can take the class attribute. The value of a class attribute may exist more than once in a document. A single element may have multiple class values.
produces:
For multiple classes:
produces:
Empty Elements
Some elements (e.g., <br>) do not have children and only an opening tag:
produces:
produces:
Non-Element Content
Text
Textual content is added to the tree using strings. This is done simply as:
doc = tb.html()
doc.add("My name is Bob!")
which produces:
It is necessary for textual content to be escaped properly tp render correctly in the browser. This is done automatically.
Raw
However, it is sometimes necessary to dump raw, prepared content into the tree that will be rendered as is. This is done using Raw.
doc = tb.html()
doc.add(Raw("<data>raw</data>"), "<data>processed</data>")
produces:
where the raw content is left untouched, but the simple text content is escaped.
Table
table = tb.table()
table.add(tb.tr(tb.th("Name"), tb.th("Age")))
for name, age in data.items():
table.add(tb.tr(tb.td(name), tb.td(age)))
or:
table = tb.table()
table.add(tb.tr(tb.th("Name"), tb.th("Age")))
table.add([tb.tr(tb.td(name), tb.td(age)) for name, age in data.items()])
produces:
<tr><th>Name</th><th>Age</th></tr>
<tr><td>Mark</td><td>25</td></tr>
<tr><td>Lucy</td><td>23</td></tr>
<tr><td>Joe</td><td>32</td></tr>
<tr><td>Jane</td><td>41</td></tr>
</table>
Select Menus
Drop Down
selectnames = tb.select([tb.option(name, _value=name) for name in names], _name="name")
produces:
<option value="john">john</option>
<option value="bill">bill</option>
<option value="louise">louise</option>
</select>
Multiple Selection
selectnames = tb.select(_name="city", _multiple=True)
selectnames.add([tb.option(city, _value=city) for city in cities])
produces:
<option value="Montreal">Montreal</option>
<option value="Toronto">Toronto</option>
<option value="Yellowknife">Yellowknife</option>
</select>
Form
form.add(tb.label("First name"), tb.input(_type="text", _size="40", _name="firstname"))
form.add(tb.label("Last name"), tb.input(_type="text", _size="40", _name="lastname"))
form.add(tb.input(_type="submit", _value="Submit"))
produces:
<label>First name</label><input name="firstname" size="40" type="text">
<label>Last name</label><input name="lastname" size="40" type="text">
<input type="submit" value="Submit">
</form>