API: dom YAHOO.util.Dom (YUI Library)

# Yahoo! UI Library

### dom 2.9.0

Yahoo! UI Library > dom > YAHOO.util.Dom
Search:
Filters Show Private Show Protected Show Deprecated

## Class YAHOO.util.Dom

Provides helper methods for DOM elements.

### Methods

#### addClass

`Boolean | Array addClass ( el , className )`
Adds a class name to a given element or collection of elements.

Parameters:
  `el <String | HTMLElement | Array>` The element or collection to add the class to
  `className <String>` the class name to add to the class attribute

Returns: `Boolean | Array`
  A pass/fail boolean or array of booleans

#### batch

`Any | Array batch ( el , method , o , overrides )`
Runs the supplied method against each item in the Collection/Array. The method is called with the element(s) as the first arg, and the optional param as the second ( method(el, o) ).

Parameters:
  `el <String | HTMLElement | Array>` (optional) An element or array of elements to apply the method to
  `method <Function>` The method to apply to the element(s)
  `o <Any>` (optional) An optional arg that is passed to the supplied method
  `overrides <Boolean>` (optional) Whether or not to override the scope of "method" with "o"

Returns: `Any | Array`
  The return value(s) from the supplied method

#### generateId

`String | Array generateId ( el , prefix )`
Returns an ID and applies it to the element "el", if provided.

Parameters:
  `el <String | HTMLElement | Array>` (optional) An optional element array of elements to add an ID to (no ID is added if one is already present).
  `prefix <String>` (optional) an optional prefix to use (defaults to "yui-gen").

Returns: `String | Array`
  The generated ID, or array of generated IDs (or original ID if already present on an element)

#### get

`HTMLElement | Array get ( el )`
Returns an HTMLElement reference.

Parameters:
  `el <String | HTMLElement |Array>` Accepts a string to use as an ID for getting a DOM reference, an actual DOM reference, or an Array of IDs and/or HTMLElements.

Returns: `HTMLElement | Array`
  A DOM reference to an HTML element or an array of HTMLElements.

#### getAncestorBy

`Object getAncestorBy ( node , method )`
Returns the nearest ancestor that passes the test applied by supplied boolean method. For performance reasons, IDs are not accepted and argument validation omitted.

Parameters:
  `node <HTMLElement>` The HTMLElement to use as the starting point
  `method <Function>` - A boolean method for testing elements which receives the element as its only argument.

Returns: `Object`
  HTMLElement or null if not found

#### getAncestorByClassName

`Object getAncestorByClassName ( node , className )`
Returns the nearest ancestor with the given className.

Parameters:
  `node <String | HTMLElement>` The HTMLElement or an ID to use as the starting point
  `className <String>`

Returns: `Object`
  HTMLElement

#### getAncestorByTagName

`Object getAncestorByTagName ( node , tagName )`
Returns the nearest ancestor with the given tagName.

Parameters:
  `node <String | HTMLElement>` The HTMLElement or an ID to use as the starting point
  `tagName <String>`

Returns: `Object`
  HTMLElement

#### getAttribute

`String getAttribute ( el , attr )`
Provides a normalized attribute interface.

Parameters:
  `el <String | HTMLElement>` The target element for the attribute.
  `attr <String>` The attribute to get.

Returns: `String`
  The current value of the attribute.

#### getChildren

`Array getChildren ( node )`
Returns an array of HTMLElement childNodes.

Parameters:
  `node <String | HTMLElement>` The HTMLElement or an ID to use as the starting point

Returns: `Array`
  A static array of HTMLElements

#### getChildrenBy

`Array getChildrenBy ( node , method )`
Returns an array of HTMLElement childNodes that pass the test method.

Parameters:
  `node <HTMLElement>` The HTMLElement to start from
  `method <Function>` A boolean function used to test children that receives the node being tested as its only argument

Returns: `Array`
  A static array of HTMLElements

#### getClientHeight

`Int getClientHeight ( )`
Returns the height of the client (viewport).

Returns: `Int`
  The height of the viewable area of the page.

Deprecated Now using getViewportHeight. This interface left intact for back compat.

#### getClientRegion

`Region getClientRegion ( )`
Creates a Region based on the viewport relative to the document.

Returns: `Region`
  A Region object representing the viewport which accounts for document scroll

#### getClientWidth

`Int getClientWidth ( )`
Returns the width of the client (viewport).

Returns: `Int`
  The width of the viewable area of the page.

Deprecated Now using getViewportWidth. This interface left intact for back compat.

#### getDocumentHeight

`Int getDocumentHeight ( )`
Returns the height of the document.

Returns: `Int`
  The height of the actual document (which includes the body and its margin).

#### getDocumentScrollLeft

`Int getDocumentScrollLeft ( document )`
Returns the left scroll value of the document

Parameters:
  `document <HTMLDocument>` (optional) The document to get the scroll value of

Returns: `Int`
  The amount that the document is scrolled to the left

#### getDocumentScrollTop

`Int getDocumentScrollTop ( document )`
Returns the top scroll value of the document

Parameters:
  `document <HTMLDocument>` (optional) The document to get the scroll value of

Returns: `Int`
  The amount that the document is scrolled to the top

#### getDocumentWidth

`Int getDocumentWidth ( )`
Returns the width of the document.

Returns: `Int`
  The width of the actual document (which includes the body and its margin).

#### getElementBy

`HTMLElement getElementBy ( method , tag , root )`
Returns the first HTMLElement that passes the test applied by the supplied boolean method.

Parameters:
  `method <Function>` - A boolean method for testing elements which receives the element as its only argument.
  `tag <String>` (optional) The tag name of the elements being collected
  `root <String | HTMLElement>` (optional) The HTMLElement or an ID to use as the starting point

#### getElementsBy

`Array getElementsBy ( method , tag , root , apply , o , overrides )`
Returns an array of HTMLElements that pass the test applied by supplied boolean method. For optimized performance, include a tag and/or root node when possible. Note: This method operates against a live collection, so modifying the collection in the callback (removing/appending nodes, etc.) will have side effects. Instead you should iterate the returned nodes array, as you would with the native "getElementsByTagName" method.

Parameters:
  `method <Function>` - A boolean method for testing elements which receives the element as its only argument.
  `tag <String>` (optional) The tag name of the elements being collected
  `root <String | HTMLElement>` (optional) The HTMLElement or an ID to use as the starting point
  `apply <Function>` (optional) A function to apply to each element when found
  `o <Any>` (optional) An optional arg that is passed to the supplied method
  `overrides <Boolean>` (optional) Whether or not to override the scope of "method" with "o"

Returns: `Array`
  Array of HTMLElements

#### getElementsByClassName

`Array getElementsByClassName ( className , tag , root , apply , o , overrides )`
Returns an array of HTMLElements with the given class. For optimized performance, include a tag and/or root node when possible. Note: This method operates against a live collection, so modifying the collection in the callback (removing/appending nodes, etc.) will have side effects. Instead you should iterate the returned nodes array, as you would with the native "getElementsByTagName" method.

Parameters:
  `className <String>` The class name to match against
  `tag <String>` (optional) The tag name of the elements being collected
  `root <String | HTMLElement>` (optional) The HTMLElement or an ID to use as the starting point. This element is not included in the className scan.
  `apply <Function>` (optional) A function to apply to each element when found
  `o <Any>` (optional) An optional arg that is passed to the supplied method
  `overrides <Boolean>` (optional) Whether or not to override the scope of "method" with "o"

Returns: `Array`
  An array of elements that have the given class name

#### getFirstChild

`Object getFirstChild ( node )`
Returns the first HTMLElement child.

Parameters:
  `node <String | HTMLElement>` The HTMLElement or an ID to use as the starting point

Returns: `Object`
  HTMLElement or null if not found

#### getFirstChildBy

`Object getFirstChildBy ( node , method )`
Returns the first HTMLElement child that passes the test method.

Parameters:
  `node <HTMLElement>` The HTMLElement to use as the starting point
  `method <Function>` A boolean function used to test children that receives the node being tested as its only argument

Returns: `Object`
  HTMLElement or null if not found

#### getLastChild

`Object getLastChild ( node )`
Returns the last HTMLElement child.

Parameters:
  `node <String | HTMLElement>` The HTMLElement or an ID to use as the starting point

Returns: `Object`
  HTMLElement or null if not found

#### getLastChildBy

`Object getLastChildBy ( node , method )`
Returns the last HTMLElement child that passes the test method.

Parameters:
  `node <HTMLElement>` The HTMLElement to use as the starting point
  `method <Function>` A boolean function used to test children that receives the node being tested as its only argument

Returns: `Object`
  HTMLElement or null if not found

#### getNextSibling

`Object getNextSibling ( node )`
Returns the next sibling that is an HTMLElement

Parameters:
  `node <String | HTMLElement>` The HTMLElement or an ID to use as the starting point

Returns: `Object`
  HTMLElement or null if not found

#### getNextSiblingBy

`Object getNextSiblingBy ( node , method )`
Returns the next HTMLElement sibling that passes the boolean method. For performance reasons, IDs are not accepted and argument validation omitted. Returns the nearest HTMLElement sibling if no method provided.

Parameters:
  `node <HTMLElement>` The HTMLElement to use as the starting point
  `method <Function>` A boolean function used to test siblings that receives the sibling node being tested as its only argument

Returns: `Object`
  HTMLElement or null if not found

#### getPreviousSibling

`Object getPreviousSibling ( node )`
Returns the previous sibling that is an HTMLElement

Parameters:
  `node <String | HTMLElement>` The HTMLElement or an ID to use as the starting point

Returns: `Object`
  HTMLElement or null if not found

#### getPreviousSiblingBy

`Object getPreviousSiblingBy ( node , method )`
Returns the previous sibling that is an HTMLElement. For performance reasons, IDs are not accepted and argument validation omitted. Returns the nearest HTMLElement sibling if no method provided.

Parameters:
  `node <HTMLElement>` The HTMLElement to use as the starting point
  `method <Function>` A boolean function used to test siblings that receives the sibling node being tested as its only argument

Returns: `Object`
  HTMLElement or null if not found

#### getRegion

`Region | Array getRegion ( el )`
Returns the region position of the given element. The element must be part of the DOM tree to have a region (display:none or elements not appended return false).

Parameters:
  `el <String | HTMLElement | Array>` Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.

Returns: `Region | Array`
  A Region or array of Region instances containing "top, left, bottom, right" member data.

#### getStyle

`String | Array getStyle ( el , property )`
Normalizes currentStyle and ComputedStyle.

Parameters:
  `el <String | HTMLElement |Array>` Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
  `property <String>` The style property whose value is returned.

Returns: `String | Array`
  The current value of the style property for the element(s).

#### getViewportHeight

`Int getViewportHeight ( )`
Returns the current height of the viewport.

Returns: `Int`
  The height of the viewable area of the page (excludes scrollbars).

#### getViewportWidth

`Int getViewportWidth ( )`
Returns the current width of the viewport.

Returns: `Int`
  The width of the viewable area of the page (excludes scrollbars).

#### getX

`Number | Array getX ( el )`
Gets the current X position of an element based on page coordinates. The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).

Parameters:
  `el <String | HTMLElement | Array>` Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements

Returns: `Number | Array`
  The X position of the element(s)

#### getXY

`Array getXY ( el )`
Gets the current position of an element based on page coordinates. Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).

Parameters:
  `el <String | HTMLElement | Array>` Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements

Returns: `Array`
  The XY position of the element(s)

#### getY

`Number | Array getY ( el )`
Gets the current Y position of an element based on page coordinates. Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).

Parameters:
  `el <String | HTMLElement | Array>` Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements

Returns: `Number | Array`
  The Y position of the element(s)

#### hasClass

`Boolean | Array hasClass ( el , className )`
Determines whether an HTMLElement has the given className.

Parameters:
  `el <String | HTMLElement | Array>` The element or collection to test
  `className <String | RegExp>` the class name to search for, or a regular expression to match against

Returns: `Boolean | Array`
  A boolean value or array of boolean values

#### inDocument

`Boolean inDocument ( el , doc )`
Determines whether an HTMLElement is present in the current document.

Parameters:
  `el <String | HTMLElement>` The element to search for
  `doc <Object>` An optional document to search, defaults to element's owner document

Returns: `Boolean`
  Whether or not the element is present in the current document

#### insertAfter

`HTMLElement insertAfter ( newNode , referenceNode )`
Inserts the new node as the next sibling of the reference node

Parameters:
  `newNode <String | HTMLElement>` The node to be inserted
  `referenceNode <String | HTMLElement>` The node to insert the new node after

Returns: `HTMLElement`
  The node that was inserted (or null if insert fails)

#### insertBefore

`HTMLElement insertBefore ( newNode , referenceNode )`
Inserts the new node as the previous sibling of the reference node

Parameters:
  `newNode <String | HTMLElement>` The node to be inserted
  `referenceNode <String | HTMLElement>` The node to insert the new node before

Returns: `HTMLElement`
  The node that was inserted (or null if insert fails)

#### isAncestor

`Boolean isAncestor ( haystack , needle )`
Determines whether an HTMLElement is an ancestor of another HTML element in the DOM hierarchy.

Parameters:
  `haystack <String | HTMLElement>` The possible ancestor
  `needle <String | HTMLElement>` The possible descendent

Returns: `Boolean`
  Whether or not the haystack is an ancestor of needle

#### removeClass

`Boolean | Array removeClass ( el , className )`
Removes a class name from a given element or collection of elements.

Parameters:
  `el <String | HTMLElement | Array>` The element or collection to remove the class from
  `className <String>` the class name to remove from the class attribute

Returns: `Boolean | Array`
  A pass/fail boolean or array of booleans

#### replaceClass

`Boolean | Array replaceClass ( el , oldClassName , newClassName )`
Replace a class with another class for a given element or collection of elements. If no oldClassName is present, the newClassName is simply added.

Parameters:
  `el <String | HTMLElement | Array>` The element or collection to remove the class from
  `oldClassName <String>` the class name to be replaced
  `newClassName <String>` the class name that will be replacing the old class name

Returns: `Boolean | Array`
  A pass/fail boolean or array of booleans

#### setAttribute

`void setAttribute ( el , attr , val )`
Provides a normalized attribute interface.

Parameters:
  `el <String | HTMLElement>` The target element for the attribute.
  `attr <String>` The attribute to set.
  `val <String>` The value of the attribute.

#### setStyle

`void setStyle ( el , property , val )`
Wrapper for setting style properties of HTMLElements. Normalizes "opacity" across modern browsers.

Parameters:
  `el <String | HTMLElement | Array>` Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
  `property <String>` The style property to be set.
  `val <String>` The value to apply to the given property.

#### setX

`void setX ( el , x )`
Set the X position of an html element in page coordinates, regardless of how the element is positioned. The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).

Parameters:
  `el <String | HTMLElement | Array>` Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
  `x <Int>` The value to use as the X coordinate for the element(s).

#### setXY

`void setXY ( el , pos , noRetry )`
Set the position of an html element in page coordinates, regardless of how the element is positioned. The element(s) must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).

Parameters:
  `el <String | HTMLElement | Array>` Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements
  `pos <Array>` Contains X & Y values for new position (coordinates are page-based)
  `noRetry <Boolean>` By default we try and set the position a second time if the first fails

#### setY

`void setY ( el , x )`
Set the Y position of an html element in page coordinates, regardless of how the element is positioned. The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).

Parameters:
  `el <String | HTMLElement | Array>` Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
  `x <Int>` To use as the Y coordinate for the element(s).

Copyright © 2011 Yahoo! Inc. All rights reserved.