#

API Docs for: 3.10.3
Show: Inherited Protected Private Deprecated

# DOM Class

Defined in: `dom/js/dom-core.js:38`
Module: dom-base
Parent Module: dom

Provides DOM helper methods.

- Index
- Methods

## Item Index

### Methods

- _bruteContains
- _getDoc
- _getRegExp
- _getWin
- addClass
- addHTML
- byId
- contains
- create
- docHeight
- docScrollX
- docScrollY
- docWidth
- elementByAxis
- getAttribute
- getComputedStyle
- getScrollbarWidth
- getStyle
- getText
- getX
- getXY
- getY
- hasClass
- inDoc
- inRegion
- intersect
- inViewportRegion
- region
- removeClass
- replaceClass
- setAttribute
- setHeight
- setStyle
- setStyles
- setText
- setWidth
- setX
- setXY
- setY
- swapXY
- toggleClass
- viewportRegion
- winHeight
- winWidth

## Methods

### `_bruteContains`

(

- `element`
- `needle`

)
Boolean private

Defined in `dom/js/dom-core.js:282`

Brute force version of contains. Used for browsers without contains support for non-HTMLElement Nodes (textNodes, etc).

#### Parameters:

- `element` HTMLElement

  The containing html element.

- `needle` HTMLElement

  The html element that may be contained.

#### Returns:

Boolean: Whether or not the element is or contains the needle.

### `_getDoc`

(

- `element`

)
Object private

Defined in `dom/js/dom-core.js:320`

returns the appropriate document.

#### Parameters:

- `element` HTMLElement

  optional Target element.

#### Returns:

Object: The document for the given element or the default document.

### `_getRegExp`

(

- `str`
- `flags`

)
RegExp private

Defined in `dom/js/dom-core.js:302`

Memoizes dynamic regular expressions to boost runtime performance.

#### Parameters:

- `str` String

  The string to convert to a regular expression.

- `flags` String

  optional An optinal string of flags.

#### Returns:

RegExp: An instance of RegExp

### `_getWin`

(

- `element`

)
Object private

Defined in `dom/js/dom-core.js:339`

returns the appropriate window.

#### Parameters:

- `element` HTMLElement

  optional Target element.

#### Returns:

Object: The window for the given element or the default window.

### `addClass`

(

- `element`
- `className`

)

Provided by the dom module.

Defined in `dom/js/dom-class.js:17`

Adds a class name to a given DOM element.

#### Parameters:

- `element` HTMLElement

  The DOM element.

- `className` String

  the class name to add to the class attribute

### `addHTML`

(

- `node`
- `content`
- `where`

)

Provided by the dom module.

Defined in `dom/js/dom-create.js:145`

Inserts content in a node at the given location

#### Parameters:

- `node` HTMLElement

  The node to insert into

- `content` HTMLElement | Array | HTMLCollection

  The content to be inserted

- `where` HTMLElement

  Where to insert the content If no "where" is given, content is appended to the node Possible values for "where"

  HTMLElement
    The element to insert before
  "replace"
    Replaces the existing HTML
  "before"
    Inserts before the existing HTML
  "before"
    Inserts content before the node
  "after"
    Inserts content after the node

### `byId`

(

- `id`
- `doc`

)
HTMLElement | null

Defined in `dom/js/dom-core.js:45`

Returns the HTMLElement with the given ID (Wrapper for document.getElementById).

#### Parameters:

- `id` String

  the id attribute

- `doc` Object

  optional The document to search. Defaults to current document

#### Returns:

HTMLElement | null: The HTMLElement with the id, or null if none found.

### `contains`

(

- `element`
- `needle`

)
Boolean

Defined in `dom/js/dom-core.js:150`

Determines whether or not one HTMLElement is or contains another HTMLElement.

#### Parameters:

- `element` HTMLElement

  The containing html element.

- `needle` HTMLElement

  The html element that may be contained.

#### Returns:

Boolean: Whether or not the element is or contains the needle.

### `create`

(

- `html`
- `doc`

)
HTMLElement | DocumentFragment

Provided by the dom module.

Defined in `dom/js/dom-create.js:73`

Creates a new dom node using the provided markup string.

#### Parameters:

- `html` String

  The markup used to create the element

- `doc` HTMLDocument

  An optional document context

#### Returns:

HTMLElement | DocumentFragment: returns a single HTMLElement when creating one node, and a documentFragment when creating multiple nodes.

### `docHeight`

() Number

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:63`

Document height

#### Returns:

Number: The current height of the document.

### `docScrollX`

() Number

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:85`

Amount page has been scroll horizontally

#### Returns:

Number: The current amount the screen is scrolled horizontally.

### `docScrollY`

() Number

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:97`

Amount page has been scroll vertically

#### Returns:

Number: The current amount the screen is scrolled vertically.

### `docWidth`

() Number

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:74`

Document width

#### Returns:

Number: The current width of the document.

### `elementByAxis`

(

- `element`
- `axis`
- `fn`
- `all`

)
HTMLElement | null

Defined in `dom/js/dom-core.js:126`

Searches the element by the given axis for the first matching element.

#### Parameters:

- `element` HTMLElement

  The html element.

- `axis` String

  The axis to search (parentNode, nextSibling, previousSibling).

- `fn` Function

  optional An optional boolean test to apply.

- `all` Boolean

  optional Whether all node types should be returned, or just element nodes. The optional function is passed the current HTMLElement being tested as its only argument. If no function is given, the first element is returned.

#### Returns:

HTMLElement | null: The matching element or null if none found.

### `getAttribute`

(

- `el`
- `attr`

)
String

Provided by the dom module.

Defined in `dom/js/dom-attrs.js:78`

Provides a normalized attribute interface.

#### Parameters:

- `el` HTMLElement

  The target element for the attribute.

- `attr` String

  The attribute to get.

#### Returns:

String: The current value of the attribute.

### `getComputedStyle`

(

- `An`
- `att`

)
String

Provided by the dom-style module.

Defined in `dom/js/dom-style.js:126`

Returns the computed style for the given node.

#### Parameters:

- `An` HTMLElement

  HTMLElement to get the style from.

- `att` String

  The style property to get.

#### Returns:

String: The computed value of the style property.

### `getScrollbarWidth`

() Number

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:254`

Gets the width of vertical scrollbars on overflowed containers in the body content.

#### Returns:

Number: Pixel width of a scrollbar in the current browser

### `getStyle`

(

- `An`
- `att`

)

Provided by the dom-style module.

Defined in `dom/js/dom-style.js:85`

Returns the current style value for the given property.

#### Parameters:

- `An` HTMLElement

  HTMLElement to get the style from.

- `att` String

  The style property to get.

### `getText`

(

- `element`

)
String

Provided by the dom module.

Defined in `dom/js/dom-attrs.js:14`

Returns the text content of the HTMLElement.

#### Parameters:

- `element` HTMLElement

  The html element.

#### Returns:

String: The text content of the element (includes text of any descending elements).

### `getX`

(

- `element`

)
Number

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:280`

Gets the current X 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:

- `element` Object

  The target element

#### Returns:

Number: The X position of the element

### `getXY`

(

- `element`

)
Array

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:109`

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:

- `element` Object

  The target element

#### Returns:

Array: The XY position of the element

    TODO: test inDocument/display?

### `getY`

(

- `element`

)
Number

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:293`

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:

- `element` Object

  The target element

#### Returns:

Number: The Y position of the element

### `hasClass`

(

- `element`
- `className`

)
Boolean

Provided by the dom module.

Defined in `dom/js/dom-class.js:4`

Determines whether a DOM element has the given className.

#### Parameters:

- `element` HTMLElement

  The DOM element.

- `className` String

  the class name to search for

#### Returns:

Boolean: Whether or not the element has the given class.

### `inDoc`

(

- `element`
- `doc`

)
Boolean

Defined in `dom/js/dom-core.js:180`

Determines whether or not the HTMLElement is part of the document.

#### Parameters:

- `element` HTMLElement

  The containing html element.

- `doc` HTMLElement

  optional The document to check.

#### Returns:

Boolean: Whether or not the element is attached to the document.

### `inRegion`

(

- `node`
- `node2`
- `all`
- `altRegion`

)
Boolean

Provided by the dom module.

Defined in `dom/js/dom-region.js:82`

Check if any part of this node is in the passed region

#### Parameters:

- `node` Object

  The node to get the region from

- `node2` Object

  The second node to get the region from or an Object literal of the region

- `all` Boolean

  Should all of the node be inside the region

- `altRegion` Object

  An object literal containing the region for this node if we already have the data (for performance e.g. DragDrop)

#### Returns:

Boolean: True if in region, false if not.

### `intersect`

(

- `element`
- `element2`
- `altRegion`

)
Object

Provided by the dom module.

Defined in `dom/js/dom-region.js:47`

Find the intersect information for the passed nodes.

#### Parameters:

- `element` HTMLElement

  The first element

- `element2` HTMLElement | Object

  The element or region to check the interect with

- `altRegion` Object

  An object literal containing the region for the first element if we already have the data (for performance e.g. DragDrop)

#### Returns:

Object: Object literal containing the following intersection data: (top, right, bottom, left, area, yoff, xoff, inRegion)

### `inViewportRegion`

(

- `element`
- `all`
- `altRegion`

)
Boolean

Provided by the dom module.

Defined in `dom/js/dom-region.js:123`

Check if any part of this element is in the viewport

#### Parameters:

- `element` HTMLElement

  The DOM element.

- `all` Boolean

  Should all of the node be inside the region

- `altRegion` Object

  An object literal containing the region for this node if we already have the data (for performance e.g. DragDrop)

#### Returns:

Boolean: True if in region, false if not.

### `region`

(

- `element`

)
Object

Provided by the dom module.

Defined in `dom/js/dom-region.js:24`

Returns an Object literal containing the following about this element: (top, right, bottom, left)

#### Parameters:

- `element` HTMLElement

  The DOM element.

#### Returns:

Object: Object literal containing the following about this element: (top, right, bottom, left)

### `removeClass`

(

- `element`
- `className`

)

Provided by the dom module.

Defined in `dom/js/dom-class.js:30`

Removes a class name from a given element.

#### Parameters:

- `element` HTMLElement

  The DOM element.

- `className` String

  the class name to remove from the class attribute

### `replaceClass`

(

- `element`
- `oldClassName`
- `newClassName`

)

Provided by the dom module.

Defined in `dom/js/dom-class.js:48`

Replace a class with another class for a given element. If no oldClassName is present, the newClassName is simply added.

#### Parameters:

- `element` HTMLElement

  The DOM element

- `oldClassName` String

  the class name to be replaced

- `newClassName` String

  the class name that will be replacing the old class name

### `setAttribute`

(

- `el`
- `attr`
- `val`

)

Provided by the dom module.

Defined in `dom/js/dom-attrs.js:62`

Provides a normalized attribute interface.

#### Parameters:

- `el` HTMLElement

  The target element for the attribute.

- `attr` String

  The attribute to set.

- `val` String

  The value of the attribute.

### `setHeight`

(

- `element`
- `size`

)

Provided by the dom module.

Defined in `dom/js/dom-size.js:14`

Sets the height of the element to the given size, regardless of box model, border, padding, etc.

#### Parameters:

- `element` HTMLElement

  The DOM element.

- `size` String | Number

  The pixel height to size to

### `setStyle`

(

- `An`
- `att`
- `val`

)

Provided by the dom-style module.

Defined in `dom/js/dom-style.js:52`

Sets a style property for a given element.

#### Parameters:

- `An` HTMLElement

  HTMLElement to apply the style to.

- `att` String

  The style property to set.

- `val` String | Number

  The value.

### `setStyles`

(

- `node`
- `hash`

)

Provided by the dom-style module.

Defined in `dom/js/dom-style.js:113`

Sets multiple style properties.

#### Parameters:

- `node` HTMLElement

  An HTMLElement to apply the styles to.

- `hash` Object

  An object literal of property:value pairs.

### `setText`

(

- `element`
- `content`

)

Provided by the dom module.

Defined in `dom/js/dom-attrs.js:35`

Sets the text content of the HTMLElement.

#### Parameters:

- `element` HTMLElement

  The html element.

- `content` String

  The content to add.

### `setWidth`

(

- `element`
- `size`

)

Provided by the dom module.

Defined in `dom/js/dom-size.js:2`

Sets the width of the element to the given size, regardless of box model, border, padding, etc.

#### Parameters:

- `element` HTMLElement

  The DOM element.

- `size` String | Number

  The pixel height to size to

### `setX`

(

- `element`
- `x`

)

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:352`

Set the X 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:

- `element` Object

  The target element

- `x` Number

  The X values for new position (coordinates are page-based)

### `setXY`

(

- `element`
- `xy`
- `noRetry`

)

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:306`

Set the position of an html element in page coordinates. The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).

#### Parameters:

- `element` Object

  The target element

- `xy` 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`

(

- `element`
- `y`

)

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:363`

Set the Y 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:

- `element` Object

  The target element

- `y` Number

  The Y values for new position (coordinates are page-based)

### `swapXY`

(

- `node`
- `otherNode`

)
Node

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:374`

Swap the xy position with another node

#### Parameters:

- `node` Node

  The node to swap with

- `otherNode` Node

  The other node to swap with

#### Returns:

Node:

### `toggleClass`

(

- `element`
- `className`
- `addClass`

)

Provided by the dom module.

Defined in `dom/js/dom-class.js:63`

If the className exists on the node it is removed, if it doesn't exist it is added.

#### Parameters:

- `element` HTMLElement

  The DOM element

- `className` String

  the class name to be toggled

- `addClass` Boolean

  optional boolean to indicate whether class should be added or removed regardless of current state

### `viewportRegion`

() Object

Provided by the dom module.

Defined in `dom/js/dom-region.js:150`

Returns an Object literal containing the following about the visible region of viewport: (top, right, bottom, left)

#### Returns:

Object: Object literal containing the following about the visible region of the viewport: (top, right, bottom, left)

### `winHeight`

() Number

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:41`

Returns the inner height of the viewport (exludes scrollbar).

#### Returns:

Number: The current height of the viewport.

### `winWidth`

() Number

Provided by the dom-screen module.

Defined in `dom/js/dom-screen.js:52`

Returns the inner width of the viewport (exludes scrollbar).

#### Returns:

Number: The current width of the viewport.