dom.js

Members

static, constant $
utils/dom.js, line 814

Finds a single DOM element matching selector within the optional context of another DOM element (defaulting to document).

static, constant $$
utils/dom.js, line 833

Finds a all DOM elements matching selector within the optional context of another DOM element (defaulting to document).

Methods

static addElClass(element, classToAdd) → {Element}
utils/dom.js, line 349

Add a CSS class name to an element

Parameters:
Name Type Description
element Element

Element to add class name to.
classToAdd string

Class name to add.
Returns:
Element -

The dom element with the added class name.

static appendContent(el, content) → {Element}
utils/dom.js, line 775

Normalizes and appends content to an element.

Parameters:
Name Type Description
el Element

Element to append normalized content to.
content String | Element | TextNode | Array | function

See the content argument of dom:normalizeContent
Returns:
Element -

The element with appended normalized content.

static blockTextSelection()
utils/dom.js, line 561

Attempt to block the ability to select text while dragging controls

static createEl(tagNameopt, propertiesopt, attributesopt, contentopt) → {Element}
utils/dom.js, line 148

Creates an element and applies properties.

Parameters:
Name Type Attributes Default Description
tagName string <optional>
 'div'

Name of tag to be created.
properties Object <optional>
 {}

Element properties to be applied.
attributes Object <optional>
 {}

Element attributes to be applied.
content String | Element | TextNode | Array | function <optional>

Contents for the element (see: dom:normalizeContent)
Returns:
Element -

The element that was created.

static emptyEl(el) → {Element}
utils/dom.js, line 706

Empties the contents of an element.

Parameters:
Name Type Description
el Element

The element to empty children from
Returns:
Element -

The element with no children

static findElPosition(el) → {Dom~Position}
utils/dom.js, line 602

Offset Left. getBoundingClientRect technique from John Resig

Parameters:
Name Type Description
el Element

Element from which to get offset
Returns:
Dom~Position -

The position of the element that was passed in.

See:

static getAttribute(el, attribute) → {string}
utils/dom.js, line 525

Get the value of an element's attribute

Parameters:
Name Type Description
el Element

A DOM element
attribute string

Attribute to get the value of
Returns:
string -

value of the attribute

static getEl(id) → {Element|null}
utils/dom.js, line 122

Shorthand for document.getElementById() Also allows for CSS (jQuery) ID syntax. But nothing other than IDs.

Parameters:
Name Type Description
id string

The id of the element to get
Returns:
Element | null -

Element with supplied ID or null if there wasn't one.

static getElAttributes(tag) → {Object}
utils/dom.js, line 482

Get an element's attribute values, as defined on the HTML tag Attributes are not the same as properties. They're defined on the tag or with setAttribute (which shouldn't be used with HTML) This will return true or false for boolean attributes.

Parameters:
Name Type Description
tag Element

Element from which to get tag attributes.
Returns:
Object -

All attributes of the element.

static getElData(el) → {Object}
utils/dom.js, line 250

Returns the cache object where data for an element is stored

Parameters:
Name Type Description
el Element

Element to store data for.
Returns:
Object -

The cache object for that el that was passed in.

static getPointerPosition(el, event) → {Dom~Coordinates}
utils/dom.js, line 661

Get pointer position in element Returns an object with x and y coordinates. The base on the coordinates are the bottom left of the element.

Parameters:
Name Type Description
el Element

Element on which to get the pointer position on
event EventTarget~Event

Event object
Returns:
Dom~Coordinates -

A Coordinates object corresponding to the mouse position.

static hasElClass(element, classToCheck) → {boolean}
utils/dom.js, line 329

Check if an element has a CSS class

Parameters:
Name Type Description
element Element

Element to check
classToCheck string

Class name to check for
Throws:

Throws an error if classToCheck has white space.

Type
Error
Returns:
boolean -
  • True if the element had the class
      - False otherwise.

static hasElData(el) → {boolean}
utils/dom.js, line 274

Returns whether or not an element has cached data

Parameters:
Name Type Description
el Element

Check if this element has cached data.
Returns:
boolean -
  • True if the DOM element has cached data.
      - False otherwise.

static insertContent(el, content) → {Element}
utils/dom.js, line 794

Normalizes and inserts content into an element; this is identical to appendContent(), except it empties the element first.

Parameters:
Name Type Description
el Element

Element to insert normalized content into.
content String | Element | TextNode | Array | function

See the content argument of dom:normalizeContent
Returns:
Element -

The element with inserted normalized content.

static insertElFirst(child, parent)
utils/dom.js, line 214

Insert an element as the first child node of another

Parameters:
Name Type Description
child Element

Element to insert
parent Element

Element to insert child into

static isEl(value) → {boolean}
utils/dom.js, line 84

Determines, via duck typing, whether or not a value is a DOM element.

Parameters:
Name Type Description
value Mixed

The thing to check
Returns:
boolean -
  • True if it is a DOM element
      - False otherwise

static isReal() → {Boolean}
utils/dom.js, line 63

Whether the current DOM interface appears to be real.

Returns:
Boolean

static isTextNode(value) → {boolean}
utils/dom.js, line 693

Determines, via duck typing, whether or not a value is a text node.

Parameters:
Name Type Description
value Mixed

Check if this value is a text node.
Returns:
boolean -
  • True if it is a text node
      - False otherwise

static normalizeContent(content) → {Array}
utils/dom.js, line 734

Normalizes content for eventual insertion into the DOM.

This allows a wide range of content definition methods, but protects from falling into the trap of simply writing to innerHTML, which is an XSS concern.

The content for an element can be passed in multiple types and combinations, whose behavior is as follows:

Parameters:
Name Type Description
content String | Element | TextNode | Array | function
  • String: Normalized into a text node.
     - Element/TextNode: Passed through.
 - Array: A one-dimensional array of strings, elements, nodes, or functions
   (which return single strings, elements, or nodes).
 - Function: If the sole argument, is expected to produce a string, element,
   node, or array as defined above.
Returns:
Array -

All of the content that was passed in normalized.

static removeAttribute(el, attribute)
utils/dom.js, line 554

Remove an element's attribute

Parameters:
Name Type Description
el Element

A DOM element
attribute string

Attribute to remove

static removeElClass(element, classToRemove) → {Element}
utils/dom.js, line 374

Remove a CSS class name from an element

Parameters:
Name Type Description
element Element

Element to remove a class name from.
classToRemove string

Class name to remove
Returns:
Element -

The dom element with class name removed.

static removeElData(el)
utils/dom.js, line 290

Delete data for the element from the cache and the guid attr from getElementById

Parameters:
Name Type Description
el Element

Remove cached data for this element.

static setAttribute(el, attribute, value)
utils/dom.js, line 541

Set the value of an element's attribute

Parameters:
Name Type Description
el Element

A DOM element
attribute string

Attribute to set
value string

Value to set the attribute to

static setElAttributes(el, attributesopt)
utils/dom.js, line 458

Apply attributes to an HTML element.

Parameters:
Name Type Attributes Description
el Element

Element to add attributes to.
attributes Object <optional>

Attributes to be applied.

static textContent(el, text) → {Element}
utils/dom.js, line 195

Injects text into an element, replacing any existing contents entirely.

Parameters:
Name Type Description
el Element

The element to add text content into
text string

The text content to add.
Returns:
Element -

The element with added text content.

static toggleElClass(element, classToToggle, predicateopt) → {Element}
utils/dom.js, line 419

Adds or removes a CSS class name on an element depending on an optional condition or the presence/absence of the class name.

Parameters:
Name Type Attributes Description
element Element

The element to toggle a class name on.
classToToggle string

The class that should be toggled
predicate boolean | PredicateCallback <optional>

See the return value for Dom~PredicateCallback
Returns:
Element -

The element with a class that has been toggled.

static unblockTextSelection()
utils/dom.js, line 571

Turn off text selection blocking

inner classRegExp(className) → {RegExp}
utils/dom.js, line 54

Produce a regular expression for matching a className within an elements className.

Parameters:
Name Type Description
className string

The className to generate the RegExp for.
Returns:
RegExp -

The RegExp that will check for a specific className in an elements className.

inner createQuerier(method) → {function}
utils/dom.js, line 97

Creates functions to query the DOM using a given method.

Parameters:
Name Type Description
method string

The method to create the query with.
Returns:
function -

The query method

inner isNonBlankString(str) → {boolean}
utils/dom.js, line 23

Detect if a value is a string with any non-whitespace characters.

Parameters:
Name Type Description
str string

The string to check
Returns:
boolean -
  • True if the string is non-blank
      - False otherwise

inner throwIfWhitespace(str)
utils/dom.js, line 38

Throws an error if the passed string has whitespace. This is used by class methods to be relatively consistent with the classList API.

Parameters:
Name Type Description
str string

The string to check for whitespace.
Throws:

Throws an error if there is whitespace in the string.

Type
Error