dom.js
- Source:
- utils/dom.js
Members
-
<static, constant> $
-
Finds a single DOM element matching
selector
within the optionalcontext
of another DOM element (defaulting todocument
).- Source:
- utils/dom.js
-
<static, constant> $$
-
Finds a all DOM elements matching
selector
within the optionalcontext
of another DOM element (defaulting todocument
).- Source:
- utils/dom.js
Methods
-
<static> addElClass(element, classToAdd)
-
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.
- Source:
- utils/dom.js
Returns:
The dom element with the added class name.
- Type
- Element
-
<static> appendContent(el, content)
-
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- Source:
- utils/dom.js
Returns:
The element with appended normalized content.
- Type
- Element
-
<static> blockTextSelection()
-
Attempt to block the ability to select text while dragging controls
- Source:
- utils/dom.js
-
<static> createEl( [tagName] [, properties] [, attributes] [, content])
-
Creates an element and applies properties.
Parameters:
Name Type Argument 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)
- Source:
- utils/dom.js
Returns:
The element that was created.
- Type
- Element
-
<static> emptyEl(el)
-
Empties the contents of an element.
Parameters:
Name Type Description el
Element The element to empty children from
- Source:
- utils/dom.js
Returns:
The element with no children
- Type
- Element
-
<static> findElPosition(el)
-
Offset Left. getBoundingClientRect technique from John Resig
Parameters:
Name Type Description el
Element Element from which to get offset
- Source:
- utils/dom.js
- See:
Returns:
The position of the element that was passed in.
- Type
- Dom~Position
-
<static> getAttribute(el, attribute)
-
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
- Source:
- utils/dom.js
Returns:
value of the attribute
- Type
- string
-
<static> getEl(id)
-
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
- Source:
- utils/dom.js
Returns:
Element with supplied ID or null if there wasn't one.
- Type
- Element | null
-
<static> getElAttributes(tag)
-
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.
- Source:
- utils/dom.js
Returns:
All attributes of the element.
- Type
- Object
-
<static> getElData(el)
-
Returns the cache object where data for an element is stored
Parameters:
Name Type Description el
Element Element to store data for.
- Source:
- utils/dom.js
Returns:
The cache object for that el that was passed in.
- Type
- Object
-
<static> getPointerPosition(el, event)
-
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
- Source:
- utils/dom.js
Returns:
A Coordinates object corresponding to the mouse position.
- Type
- Dom~Coordinates
-
<static> hasElClass(element, classToCheck)
-
Check if an element has a CSS class
Parameters:
Name Type Description element
Element Element to check
classToCheck
string Class name to check for
- Source:
- utils/dom.js
Throws:
-
Throws an error if
classToCheck
has white space. - Type
- Error
Returns:
- True if the element had the class
- False otherwise.
- Type
- boolean
-
<static> hasElData(el)
-
Returns whether or not an element has cached data
Parameters:
Name Type Description el
Element Check if this element has cached data.
- Source:
- utils/dom.js
Returns:
- True if the DOM element has cached data.
- False otherwise.
- Type
- boolean
-
<static> insertContent(el, content)
-
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- Source:
- utils/dom.js
Returns:
The element with inserted normalized content.
- Type
- Element
-
<static> insertElFirst(child, parent)
-
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
- Source:
- utils/dom.js
-
<static> isEl(value)
-
Determines, via duck typing, whether or not a value is a DOM element.
Parameters:
Name Type Description value
Mixed The thing to check
- Source:
- utils/dom.js
Returns:
- True if it is a DOM element
- False otherwise
- Type
- boolean
-
<static> isReal()
-
Whether the current DOM interface appears to be real.
- Source:
- utils/dom.js
Returns:
- Type
- Boolean
-
<static> isTextNode(value)
-
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.
- Source:
- utils/dom.js
Returns:
- True if it is a text node
- False otherwise
- Type
- boolean
-
<static> normalizeContent(content)
-
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.
- Source:
- utils/dom.js
Returns:
All of the content that was passed in normalized.
- Type
- Array
- String: Normalized into a text node.
-
<static> removeAttribute(el, attribute)
-
Remove an element's attribute
Parameters:
Name Type Description el
Element A DOM element
attribute
string Attribute to remove
- Source:
- utils/dom.js
-
<static> removeElClass(element, classToRemove)
-
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
- Source:
- utils/dom.js
Returns:
The dom element with class name removed.
- Type
- Element
-
<static> removeElData(el)
-
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.
- Source:
- utils/dom.js
-
<static> setAttribute(el, attribute, value)
-
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
- Source:
- utils/dom.js
-
<static> setElAttributes(el [, attributes])
-
Apply attributes to an HTML element.
Parameters:
Name Type Argument Description el
Element Element to add attributes to.
attributes
Object <optional>
Attributes to be applied.
- Source:
- utils/dom.js
-
<static> textContent(el, text)
-
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.
- Source:
- utils/dom.js
Returns:
The element with added text content.
- Type
- Element
-
<static> toggleElClass(element, classToToggle [, predicate])
-
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 Argument 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
- Source:
- utils/dom.js
Returns:
The element with a class that has been toggled.
- Type
- Element
-
<static> unblockTextSelection()
-
Turn off text selection blocking
- Source:
- utils/dom.js
-
<inner> classRegExp(className)
-
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.
- Source:
- utils/dom.js
Returns:
The RegExp that will check for a specific
className
in an elements className.- Type
- RegExp
-
<inner> createQuerier(method)
-
Creates functions to query the DOM using a given method.
Parameters:
Name Type Description method
string The method to create the query with.
- Source:
- utils/dom.js
Returns:
The query method
- Type
- function
-
<inner> isNonBlankString(str)
-
Detect if a value is a string with any non-whitespace characters.
Parameters:
Name Type Description str
string The string to check
- Source:
- utils/dom.js
Returns:
- True if the string is non-blank
- False otherwise
- Type
- boolean
-
<inner> throwIfWhitespace(str)
-
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.
- Source:
- utils/dom.js
Throws:
-
Throws an error if there is whitespace in the string.
- Type
- Error