The Code Explorer graphically displays the elements contained in your HTML page: the external scripts such as .class (Java Applet) files, .css (Style sheets) or .js (external JavaScripts) as well as the internal elements such as the anchored objects (images), or the hyperlinks about other documents.
Once you analyze your document, it could be that you need to identify an element which has not been contemplated by AceHTML – for example, level 2 headings (H2) to which you have attributed a specific class (CLASS) (see the style sheets ).
You can create a new node so as to visualize all the elements corresponding to a given criteria with the Code Explorer.
To edit an object:
Open the context menu on the Code Explorer window.
In the menu list, click on the Objects Editor option. The Objects editor window appears.
Click on New node button. The dialog box Object properties appears.
In the Node name field, type the name to identify the node that you wish to add.
In the Tree leaf field, choose an icon that would represent the element you want to identify.
In the Graph side field, place the check mark that corresponds to the direction selected.
Click on the OK
button to go back to the Objects editor.
To identify the elements to be displayed under the node, you must now
add a leaf. If you do not associate the leaf, the node that you have just
created will not be displayed.
In the Objects editor, select the node that you have just created.
Click on the Add a leaf sheet. The dialog box Tag and attribute appears.
In the Element
field, drop the list to select the element (HTML tag) that you want represented.
Type the first letter of the tag to scroll down the list more rapidly.
In the Attribute
field, open the list to select the attribute to be associated to the element.
Type the first letter of the attribute to scroll down the list more
rapidly.
If the attribute requires a value, the field is activated. You can specify the value to be represented. This option is not mandatory.
In the Sheet area, enter a name to identify the sheet you are editing.
Click on the OK button.
If needed, add other leaves to the element.
Once you have finished, click on the Close button.
If you return to our initial example, you must create a Heading node, to which you will associate a leaf using the H2 tag and the CLASS attribute. This will give you a result similar to the one previously mentioned.