JAVASCRIPT EXAMPLES Get Tree from Page
In this example, the Uize.Dom.Tree.getTreeFromPage
static method of the Uize.Dom.Tree
module is being used to build a tree data object respresenting the structure of the document, by analyzing the occurrence of different CSS classes for section headings at different depths of the document (in this case, the CSS classes level1Header
, level2Header
, and level3Header
). A tree data object like this can be supplied to a tree menu widget, or can otherwise be used to build UI for navigating to different sections of the document (a contents tree, for example). A tree data object can also be generated from nested lists using the Uize.Dom.Tree.getTreeFromList
method (see the Get Tree from List example).
Page With Section Headings | Generated Tree Data Object | |
1. Renewable Energy
WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW
1.1. Solar Power
WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW
1.2. Wind Power
WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW
1.3. Biofuels
WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW
2. Fossil Fuels
WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW
2.1. Peak Oil
WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW
2.2. Types of Fossil Fuel
WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW
2.2.1. Oil
WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW
2.2.2. Natural Gas
WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW
2.3. Climate Change
WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW
2.4. Energy Security
WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW WWW |