• Topic
  • Discussion
  • OATWikiWeb.OATDOCloader(Last) -- Owiki? , 2016-08-19 14:58:51 Edit owiki 2016-08-19 14:58:51


    This is the basic library. Can be considered a toolkit on its own, as it provides many useful functions and shortcuts.



    This function is very popular and appears in almost every JavaScript framework available. Its purpose is to provide a shortcut for longer document.getElementById() functions. Basic usage is:

    var object = $("some_id");

    In this example, we assume that there is a HTML node with id "some_id". The $() function converts a string to the object. Note that it is perfectly correct to pass an object reference to $() function, although not very useful.

    Due to the presence of this function in toolkit, every other function that accepts a node reference as an argument can also accept its id.

    $$(className, element)

    This function returns a list of HTML nodes below element (document when not specified), belonging to a specified className.

    NOTE! Prior to OAT version 2.8, this function was identical to $v(). Please update your code to reflect this change and use $v() where appropriate.


    This function is a shortcut for $().value. You should use it when getting a value of any form element.

    OAT.Dom.create(tagName, [styleObj], [className])

    Used for dynamic creation of HTML nodes. Three parameters are accepted; the first one is mandatory. Example:

    var myDiv = OAT.Dom.create("div"); var myStyledDiv = OAT.Dom.create("div", {color : "#f00", fontWeight : "bold"}, "myDiv_class");

    The second (optional) argument style Obj is an object comprised of CSS properties. For a full list of valid properties, see Mozilla documentation and MSDN. CSS properties are not the same for all browsers, so specifying a floating element looks like:

    var element = OAT.Dom.create("div", {cssFloat:"left", styleFloat:"left"}); 

    The first declaration is for Gecko; the latter is for MSIE.

    OAT.Dom.createNS(namespace, tagName)

    Used for dynamic creation of HTML nodes in particular namespace. See also OAT.Dom.create(), above.


    Creates and returns DOM text node with value of argument text.


    Creates and returns DOM button with specified label.


    Creates and returns DOM radio input with specified name.

    OAT.Dom.image(src, srcBlank, width, height)

    Creates and returns DOM image node. src is image's URL; when PNG is used, specify srcBlank(url of transparent image) for Internet Explorer's workaround.

    OAT.Dom.option(name, value, [parent])

    Creates and returns DOM name value parent.

    var s = OAT.Dom.create("select"); OAT.Dom.option("apples",1,s); OAT.Dom.option("bananas",2,s); OAT.Dom.option("cherries",3,s);

    OAT.Dom.append([parent1, child1, child2, ...], [parent2, child1, ...],...)

    Links any number of DOM nodes. Takes variable amount of arguments, each argument must be an array. For each argument:

    • First value is taken as parent node
    • All other values are appended to parent (in order in which they appear)


    Hides specified element by setting its style.visibility property.


    Unhides previously hidden element by setting its style.visibility to default value.


    This function clears all child nodes from an element. May be called with either object reference or id-string as an argument.

    For instance, the following would remove all options from existing <select%gt; element with id "my select_element" --



    Unlinks element from DOM tree. Notice that the element is not destroyed as long as it can be referenced

    OAT.Dom.center(element, x, y, [reference])

    Centers element relative to its parent node. If reference is specified, this node is used instead of parent node. x and y are bools, specifying whether horizontal and/or vertical centering should be done.

    OAT.Dom.isChild(child, parent)

    Tests whether a child is a subnode of nodeparent. The depth is not important here.

    OAT.Dom.isClass(element, className)

    HTML elements may be of multiple classes, this function returns true when at least one of element's classes is className. Example:

    var div = OAT.Dom.create("div"); div.className = "big red fox"; alert( OAT.Dom.isClass(div,"fox"); ); // true

    OAT.Dom.addClass(element, className)

    Adds class className to element.

    OAT.Dom.removeClass(element, className)

    Removes class className from element.


    Returns size (2-item array) of current view port.


    Returns amount of scroll (2-item array) of current view port.


    Returns x and y coordinates of element's top left corner, relative to page's top left corner. Coordinates are returned in an array of two elements. To count this value, the whole tree of offsetParents must be climbed up, so it is not wise to call this function too often. Example:

    var coords = OAT.Dom.position(div);
    alert("x: " + coords[0]+", y:" + coords[1]);


    Returns x and y coordinates of element's top left corner, relative to its offsetParent, in form of array with two elements.


    Returns width and height of element(in pixels), in form of array with two elements.

    OAT.Dom.moveBy(element, dx, dy)

    Moves element by dx pixels horizontally and dy pixels vertically.

    OAT.Dom.resizeBy(element, dx, dy)

    Resizes element by dx pixels horizontally and dy pixels vertically.


    Unselects everything selected.


    Returns an object of current URI parameters. So, for/?a=b&c[]=d&c[]=e, this returns:


    OAT.Dom.changeHref(element, newHref)

    Changes the href attribute of the given element.


    Convert HTML special chars in the given string into entities.


    Decrypt entities in the given string.

    OAT.Event.attach(element, event, callback)

    Attaches function specified with callback to event detected on element. The event is specified without the "on" prefix. Function reference callback will be called with one argument, the event object reference. Example:

    OAT.Event.attach("myDiv", "click", function() { alert("!"); });

    OAT.Event.detach(element, event, callback)

    Removes attached callback from element fired with event. Note that only non-anonymous functions can be detached.


    Converts event to reference to element which fired it. This can be useful when multiple elements fire the same callback and one needs to know which element fired it. Example:

    var callback = function(event) {
            var id = OAT.Event.source(event).id;
            alert("Event fired by " + id);
    var div = OAT.Dom.create("div");
    div.id = "myDiv";
    OAT.Dom.attach(div, "click", callback);


    Cancels bubbling of event.


    Returns coordinates of event, relative to top left corner of page.


    Prevents default action if event(form submit, context menu, image-to-new-tab drag, ...).


    Include CSS stylesheet filename into the page. (See OAT.Preferences.stylePath property.) Stylesheet will be reincluded if force option is passed.

    OAT.Style.get(element, property)

    Returns a style property of element. This is different from accessing the element.style.property value, as this function returns the computed style (i.e., set by stylesheets, etc.) instead of a dynamically created one. Example:

    var family = OAT.Style.get("elementId", "fontFamily");
    alert(family); // returns actual font-family for this element, wherever it is set

    OAT.Style.apply(element, styleObj)

    Applies style Obj to element. styleObj follows the same conventions defined in OAT.Dom.create().

    OAT.Style.opacity(element, opacity)

    Sets element's opacity to opacity. Acceptable range: 0 (transparent) - 1 (opaque).

    OAT.Style.background(element, url)

    Sets element's background image to the one specified by url.



    Show Ajax window even if not explicitly requested by application.


    Use scrollable cursors.


    Do not guess window type.


    Path to the XSLT stylesheets.


    Path to the images.


    Path to the CSS stylesheets.


    Show HTTP errors.



    Returns true if used browser is Internet Explorer.


    Returns true if used browser is Internet Explorer 6.


    Returns true if used browser is Internet Explorer 7.


    Returns true if used browser is Gecko-based (Firefox, Mozilla).


    Returns true if used browser is Opera.


    Returns true if used browser is Apple WebKit.


    Returns true if used browser is KDE Konqueror.


    Returns true if used browser is KHTML-based (practically, this means Konqueror or Safari).


    Returns true if used operating system is Mac OS.


    Returns true if used operating system is Linux.


    Returns true if used operating system is Windows.

    Referenced by...