Generic base class for building and manipulating HTML markup.
Objects, which have visual representation, are most likely subclasses of this generic HTML class. It provides a set of functions to define attributes, inline styles, stylesheet selectors, DOM events and inner HTML content either as static properties or calls to the object’s methods. Direct or implicit call to ‘toString’ method returns properly formatted HTML markup string, which can be used in document.write() call or assigned to the page innerHTML property.
The two-way linking between original javascript object and it’s DOM counterpart is maintained through the use of unique ID for each object. This allows forwarding DOM events back to the proper javascript master object and, if necessary, updating the correct piece of HTML on the page.
element | Returns a reference to the HTML element. |
getAttribute | Returns HTML attribute. |
getClass | Returns CSS selector. |
getContent | Returns static HTML content. |
getEvent | Returns HTML event handler. |
getId | Returns unique ID for the object. |
getStyle | Returns inline CSS attribute. |
getTag | Returns HTML tag for the object. |
refresh | Updates HTML on the page. |
setAttribute | Sets HTML attribute. |
setClass | Sets CSS selector. |
setContent | Sets static HTML content. |
setEvent | Sets HTML event handler. |
setId | Sets ID string for an element. |
setStyle | Sets inline CSS attribute. |
setTag | Sets HTML tag for the object. |
toString | Returns HTML markup string for the object. |
Returns a reference to the HTML element.
object.element();
Reference to the HTML element
This function returns null if it is called before writing the object to the page.
Returns HTML attribute.
object.getAttribute(name);
name | String | HTML attribute name. |
HTML attribute value.
Returns CSS selector.
object.getClass(name);
name | String | Selector name. |
Selector value.
Returns static HTML content.
object.getContent(name);
name | String | content name. |
content object or function.
Returns HTML event handler.
object.getEvent(name);
name | String | HTML event name. |
HTML event handler.
Returns unique ID for the object.
object.getId();
Unique ID string.
Returns inline CSS attribute.
object.getStyle(name);
name | String | CSS attribute name. |
CSS attribute value.
Returns HTML tag for the object.
object.getTag();
HTML tag string
Updates HTML on the page.
object.refresh();
Sets HTML attribute.
object.setAttribute(name, value);
name | String | HTML attribute name. |
value | String/Function | HTML attribute value. |
Sets CSS selector.
object.setClass(name, value);
name | String | Selector name. |
value | String/Function | Selector value. |
The selector string is composed from the three parts - the prefix ('active'), the name and the value, separated by the '-' character. Normally the object class string consists of several selectors separated by space.
Selector values are stored and inherited separately within the object. This function allows easy access to single selector value without parsing the whole class string.
The following example adds 'active-template-list' stylesheet selector to the object class.
obj.setClass("template", "list");
Sets static HTML content.
object.setContent(name, value);
name | String | content name. |
value | Object/String/Function | static content. |
Sets HTML event handler.
object.setEvent(name, value);
name | String | HTML event name. |
value | String/Function | HTML event handler. |
Sets ID string for an element.
object.setId(id);
id | String | New ID. |
Sets inline CSS attribute.
object.setStyle(name, value);
name | String | CSS attribute name. |
value | String/Function | CSS attribute value. |
Sets HTML tag for the object.
object.setTag(tag);
tag | String | The new tag. |
By default each HTML object is a DIV tag. This function allows to change the tag string.
obj.setTag("SPAN");
Returns HTML markup string for the object.
object.toString();
HTML string.
Direct or implicit call to ‘toString’ method returns properly formatted HTML markup string, which can be used in document.write() call or assigned to the page innerHTML property.