The Dom Namespace

Extends the native JS DOM API across all grade-A browsers.

Summary

The Dom Namespace	Extends the native JS DOM API across all grade-A browsers.
Version	1.0
Element	These functions are bound to elements.
Properties
getElementsByClassName	http://developer.mozilla.org- /en- /docs- /DOM:document.getElementsByClassName
getElementsByTagName	http://developer.mozilla.org- /en- /docs- /DOM:document.getElementsByTagName
Document	These functions are bound to document.
Properties
getElementById	http://developer.mozilla.org- /en- /docs- /DOM:document.getElementById
getElementsByName	http://developer.mozilla.org- /en- /docs- /DOM:document.getElementsByName
IE Fixes	These functions are fixed for Internet Explorer.
Properties
getAttribute	http://developer.mozilla.org- /en- /docs- /DOM:element.getAttribute
setAttribute	http://developer.mozilla.org- /en- /docs- /DOM:element.setAttribute
hasAttribute	http://developer.mozilla.org- /en- /docs- /DOM:element.hasAttribute
Window	These functions are bound to document.defaultView.
Properties
getComputedStyle	http://developer.mozilla.org- /en- /docs- /DOM:window.getComputedStyle
getPropertyValue	Grabs individual property values from an element’s computed style
removeProperty	Removes individual property values from an element’s computed style
setProperty	Sets individual property values on an element’s computed style

Version

1.0

Requires

Flow.js.

License

Flow is licensed under a Creative Commons Attribution-Share Alike 3.0 License http://creativecommons.org/licenses/by-sa/3.0/us/. You are free to share, modify and remix our code as long as you share alike.

Notes

Some documentation assumes familiarity with the Firebug API http://getfirebug.com/console.html. Because if you’re not, you probably should go there. Now.

Element

These functions are bound to elements.

Summary

Properties
getElementsByClassName	http://developer.mozilla.org- /en- /docs- /DOM:document.getElementsByClassName
getElementsByTagName	http://developer.mozilla.org- /en- /docs- /DOM:document.getElementsByTagName

Properties

getElementsByClassName

http://developer.mozilla.org- /en- /docs- /DOM:document.getElementsByClassName

Shorthand

getByClass

Parameters

className

the class to retrieve.

Example

var foo = document.getElementsByClassName("foo");
var foo = document.getByClass("foo"); // shortcut

getElementsByTagName

http://developer.mozilla.org- /en- /docs- /DOM:document.getElementsByTagName

Shorthand

getByTag

Parameters

tagName

the tag to retrieve.

Example

var foo = document.getElementsByTagName("li");
var foo = document.getByTag("li"); // shortcut

Document

These functions are bound to document.

Summary

Properties
getElementById	http://developer.mozilla.org- /en- /docs- /DOM:document.getElementById
getElementsByName	http://developer.mozilla.org- /en- /docs- /DOM:document.getElementsByName

Properties

getElementById

http://developer.mozilla.org- /en- /docs- /DOM:document.getElementById

Shorthand

getById

Parameters

idName

the id to retrieve.

Example

var foo = document.getElementById("foo");
var foo = document.getById("foo"); // shortcut

getElementsByName

http://developer.mozilla.org- /en- /docs- /DOM:document.getElementsByName

Shorthand

getByName

Parameters

name	the name to retrieve.

Example

var foo = document.getElementsByName("foo");
var foo = document.getByName("foo"); // shortcut

IE Fixes

These functions are fixed for Internet Explorer.

Summary

Properties
getAttribute	http://developer.mozilla.org- /en- /docs- /DOM:element.getAttribute
setAttribute	http://developer.mozilla.org- /en- /docs- /DOM:element.setAttribute
hasAttribute	http://developer.mozilla.org- /en- /docs- /DOM:element.hasAttribute

Properties

getAttribute

http://developer.mozilla.org- /en- /docs- /DOM:element.getAttribute

Parameters

attribute

the attribute to retrieve.

Example

var foo = document.getElementById("foo");
var attr = foo.getAttribute("class");
// returns class (yes, even in IE)

setAttribute

http://developer.mozilla.org- /en- /docs- /DOM:element.setAttribute

Parameters

attribute	the attribute to set.
value	the value to set.

Example

var foo = document.getElementById("foo");
foo.setAttribute("class", "bar");
// sets class (yes, even in IE)

hasAttribute

http://developer.mozilla.org- /en- /docs- /DOM:element.hasAttribute

Parameters

attribute	the attribute to set.
value	the value to set.

Example

var foo = document.getElementById("foo");
if (foo.hasAttribute("class")) {
   foo.removeAttribute("class");
}
// (yes, even in IE)

Window

These functions are bound to document.defaultView.

Summary

Properties
getComputedStyle	http://developer.mozilla.org- /en- /docs- /DOM:window.getComputedStyle
getPropertyValue	Grabs individual property values from an element’s computed style
removeProperty	Removes individual property values from an element’s computed style
setProperty	Sets individual property values on an element’s computed style

Properties

getComputedStyle

http://developer.mozilla.org- /en- /docs- /DOM:window.getComputedStyle

Parameters

element	the computed element to retrieve.
pseudoElt	(optional) the computed pseudo-element to retrieve.

Example

var foo = document.getElementById("foo");
var computedStyle = document.defaultView.getComputedStyle(foo, null);

getPropertyValue

Grabs individual property values from an element’s computed style

Parameters

property

the property to retrieve.

Example

var foo = document.getElementById("foo");
var width = document.defaultView.getComputedStyle(foo, null).getPropertyValue("width");

removeProperty

Removes individual property values from an element’s computed style

Parameters

property

the property to remove.

Example

var foo = document.getElementById("foo");
var width = document.defaultView.getComputedStyle(foo, null).removeProperty("width");

setProperty

Sets individual property values on an element’s computed style

Parameters

property	the property to modify.
value	the value to set

Example

var foo = document.getElementById("foo");
var width = document.defaultView.getComputedStyle(foo, null).setProperty("width", "200");