DOM Naming Structure

DOM Naming Structure
Prev	1. Introduction	Next

The naming pattern of the DOM structure is used to describe the components which are composed of more than one part. The following recommended naming patterns are to clarify the DOM structure of ZK components, not a limitation.

Layout Elements:

-outer:
the exterior of the specified component (ends with !chdextr) like splitter in vbox and hbox
-body:
the body content, like grid, tree, listbox, and so on.
-header:
the header content, like grid, tree, listbox, and so on.
-inner:
the interior of the specified component, like slider and tab.
-cnt:
like window's contentSclass or groupbox's contentSclass
-footer:
describes the footer content, like grid, tree, listbox, and so on.

Negative option:

-noheader:
no header element.
-noborder:
no border element.
-nofooter:
no footer element.

Other Elements:

-faker:
faker element to mark a reference point at browser side, like grid, listbox, and tree.
-text:
text area.
-inp:
input element.
-sep:
separator element.
-img:
image area.
-pp:
pop-up element, like datebox, combobox, and so on.
-btn:
a button or an icon.

`Tool Icons:`

Usage	Switch	Resize	Split
Postfix	-close: describes an icon which is closed, like `tree, group`, an so on. -collapse: describes a collapsible icon, like `panel`. -collapsed: describes a collapsible icon which is collapsed, like `panel`. -expand: describes an expandable icon, like `panel`. -expanded: describes an expandable icon which is expanded, like `panel`.	-maximize: describes a maximizable icon. -maximized: describes a maximizable icon which is maximized. -minimize: describes a minimizable icon. -minimized: describes a minimizable icon which is minimized.	-split: describes a splittable icon. -ns: describes a non-splittable icon.

Prev	Up	Next
ZK Class Concept	Home	DOM Naming Position