>> ff javascript library API documentation
The library is split up into four different parts:
- ff
Basic functionility including the ff.request AJAX function
- ff.dom
DOM related functions, DOM builder
- ff.style
Functions to handle class names of DOM nodes
- ff.event
Cross-Browser event functions
ff
- ff.request( config)
- Requests an URI from the originating server and feeds the response
to a given function. The config parameter is an associative array whose
keys can be used to configurate the request. Generally the method is
called like this:
ff.request({
url : "/example",
response: function(response)
{
var text=response.text();
...
}
});
The config parameters to influence the request are:
- url
- URL to request (required)
- response
- Function to be called with the response object (required). The
response parameter wraps the XMLHTTPRequest and several methods to
retrieve the response data:
- response.xml()
- Method to return the response data as DOM tree.
- response.html()
- Method to return the response data as HTML node list.
- response.json()
- Evaluates the response as JSON and
returns the data.
- response.text()
- Returns the response data as text.
- response.xmlhttp
- The XMLHTTPRequest object associated with the request
Note that this refers to the window inside the response function.
- method
- Method to use to request ( default: "GET" )
- params
- Associative array with the parameters to send the request with,
either as URL parameters or POST body. This parameter is ignored if
the body parameter is set.
- body
- body to send with the POST request.
- error
- Function to be called if an error happens.
function errorHandler(response, exception)
{
...
}
- waitCursor
- If set to true, a wait cursor will be shown while waiting for the
request. Whether this needs to be set or not depends on how long the
request is going to take.
- ff.readParameter( formElement)
- Reads the current state of the given form formElement and returns it as
associative array.
- ff.forElement( name, className, fn, top)
- Calls the given function fn for every tag found with the tag name name having the class name className.
The function is called with the DOM element as first argument. If the top parameter is set, only children of that DOM element are regarded.
- ff.hasCapabilities()
- Returns true if the javascript implementation the library is
running on supports XMLHttpRequest and basic DOM operations.
- ff.wait( wait)
- If the parameter wait is true it sets a wait cursor, if called with false
clears the wait cursor. The method keeps track of the number of waits
so it can be nested.
- ff.extend(object, extension)
- Extends an object with the attributes of an extension bject.
The object that gets extended receives all attributes from the extension,
overwriting attributes if they already exist.
ff.dom
ff.dom contains some DOM helper functions and optionally the DOM builder
functions.
- ff.dom.init( builderBase)
- Initializes the DOM builder. The DOM functions are created as properties
of the given builderBase. If no builderBase is given, ff.dom is used as
builder base. Using ff.dom.init(window) will create the DOM functions as
top level functions.
Example 1:
ff.dom.init();
document.body.appendChild(
ff.dom.DIV( { "id" : "test" }, ff.dom.B("Test!")));
Example 2:
ff.dom.init(window);
document.body.appendChild(DIV( { "id" : "test" }, B("Test!")));
Both examples add a div element with the id "test" and a bold
"Test!" at the end of the document's body.
The dom functions are called like this:
DIV({id:"test"}, "AAA", EM(43),3.1415926)
If the first argument of a DOM function is an associative array this
array is used to set the attributes of the tag. The other arguments can
be a mix of either other tag functions or DOM elements or strings or numbers. Arguments that are null are ignored.
- ff.dom.clear( element)
- Removes all child elements of the given element.
- ff.dom.append( element, child)
- Append the given DOM Node(s) to the child elements of the given element. The child parameter can be either a
DOM element or an array of DOM elements.
- ff.dom.replace( element, newChild)
- Replaces the current child elements of the given element with the
given new child element(s). The newChild parameter can be either a
DOM element or an array of DOM elements.
- ff.dom.setAttribute( element, attribute, value)
- Crossbrowser method to set the attribute of the given
element to the given value.
- ff.dom.getAttribute( element, attribute)
- Crossbrowser method which returns the value of the attribute of the given
element.
If ff.dom.init() is called without arguments the ff.dom object will
also contain the DOM builder functions.
ff.style
ff.style contains methods to manipulate the style classes of DOM
nodes. This is nescessary because Internet Explorer does not react to a
domElement.setAttribute("class", "foo");
like you would expect it.
ff.style also contains methods to handle multiple style classes.
- ff.style.setClass( element, class)
- Sets all class names for the given DOM element to class.
- ff.style.getClass( element)
- Returns all class names for the given DOM element.
- ff.style.addClass( element, class)
- Adds the given class to the class names of the given DOM element.
- ff.style.removeClass( element, class)
- Removes the given class from the class names of the given DOM element.
- ff.style.hasClass( element, class)
- Returns true if the given DOM element has the given class.
- ff.style.toggleClass( element, class)
- Adds the given class to the given DOM element if it is not present, removes it if it is present.
Returns true if the class is set afterwards, false if not.
ff.event
ff.event provides a unified event handling for both w3 compatible
browsers and Internet Explorer. It is based on the
John
Resig's winning entry to quirkmodes addEvent recoding contest.
The keyword
this refers to the source element of the event in all functions
(which is the window for ff.event.onload functions).
- ff.event.add( element, type, fn)
- Adds the given event handler fn for the given type to the given DOM
element.
ff.event.add( domElement, "click", function()
{
alert("You clicked on the dom element");
});
- ff.event.remove( element, type, fn)
- Removes the given event handler fn of the given type from the given DOM
element.
- ff.event.onload( fn)
- Adds a function fn to be called after the document has been fully
loaded. The method supports multiple onload functions.
- ff.event.noBubble( event)
- Prevents the given event from bubbling up.
- ff.event.preventDefault( event)
- Prevents the default handling of the given event.
<< Back