DOMQuery

DomQuery : Array.<Element>

Sort of like a diet, caffeine-free jQuery. Wrapper for Sizzle library with additional methods for the Pendo Agent. Use pendo.Sizzle for customer-defined selectors. Augmented Element[] used to query and alter DOM nodes.

addClass(classNames) ⇒ DomQuery

Iterate over each element and add each class name.

Param	Type	Description
classNames	String	Space separated string of classnames.

Example

pendo.dom('div.foo').addClass('adds each word as a class')

append(selector) ⇒ DomQuery

For the first element in this list, append each element specified by the selector argument to it.

Param	Type	Description
selector	String	CSS selector to identify the target child element(s)

Example

pendo.dom('div.foo').append('span.bar')

appendTo(selector) ⇒ DomQuery

Iterate over each element and append the element to the first element in the results from the passed in selector.

Param	Type	Description
selector	String	CSS selector to identify the target parent element

Example

pendo.dom('div.foo').appendTo('div.parent')

attr(attrName, attrValue) ⇒ DomQuery

Iterate over each element and set the attribute name to the specified value

Param	Type	Description
attrName	String	Name of attribute to set
attrValue	String	Value of attribute to set

Example

pendo.dom('div.foo').attr('data-foo', 'bar')

closest(selector, demarcation) ⇒ DomQuery

Find the closest parent element that matches the specified CSS selector for the first element in this list.

Param	Type	Description
selector	String	CSS selector for element to find
demarcation	String	CSS selector for where to stop looking

Example

pendo.dom('div.foo').closest('.bar')

Example

dom('div.foo').closest('.bar', '.content-area')

css(styles) ⇒ DomQuery

Iterate over each element and apply the styles object.

Param	Type	Description
styles	Object	Object containing style attributes names and values

Example

pendo.dom('div.foo').css({height: '100px', width: '50px'}

each(callback) ⇒ DomQuery

Iterate over each element in the DomQuery list and call the provide callback function passing in the the element as the argument.

Param	Type	Description
callback	function	The callback to be called for each element in the list

Example

pendo.dom('div.foo').each((elem) => console.log('elem.id is', elem.id))

focus() ⇒ DomQuery

For each element in the list, call the element's focus method if it exists

Example

pendo.dom('div.foo').focus()

getParent() ⇒ element

Return the parent node of the first element in this list

Example

var parent = pendo.dom('div.foo').getParent()

hasClass(classNames) ⇒ Boolean

Iterate over each element and checks for each class name. Returns true if all elements have each classname.

Param	Type	Description
classNames	String	Space separated string of classnames.

Example

var allHaveClass = pendo.dom('div.foo').hasClass('check for classes')

height(height) ⇒ DomQuery

Set the height or unset the height for the first element in the list

Param	Type	Description
height	Number	The new height to set. Undefined will remove the height allow it to auto determined.

Example

pendo.dom('div.foo').height(100)

Example

pendo.dom('div.foo).height()

html(htmlString) ⇒ DomQuery

Iterate over each element in the DomQuery list and create and append the Elements represented by the HTML string provided.

Param	Type	Description
htmlString	String	String representing html to be created as dom Elements for each of the Elements in the list.

Example

pendo.dom('div.foo').html('<span>hello there</span>');

insertBefore(selector) ⇒ DomQuery

For the first element in this list, insert the first element from the selector before it in parent element's child nodes list.

Param	Type	Description
selector	String	CSS selector for the element to be inserted before this element

Example

pendo.dom('div.foo').insertBefore('div.beforeFoo')

prepend(selector) ⇒ DomQuery

Add all children from the selector as top most children of the first element in this list

Param	Type	Description
selector	String	CSS selector to identify top most child element(s)

Example

pendo.dom('div.foo').prepend('div.new-first-child')

prependTo(selector) ⇒ DomQuery

Add all elements in the list as top most child nodes of the first element found for the given selector.

Param	Type	Description
selector	String	CSS selector to identify the target parent element

Example

pendo.dom('div.foo').prependTo('div.parent')

remove() ⇒ DomQuery

Iterate over each element and remove it from the DOM.

Example

pendo.dom('div.foo').remove()

removeClass(classNames) ⇒ DomQuery

Iterate over each element and remove each class name.

Param	Type	Description
classNames	String	Space separated string of classnames.

Example

pendo.dom('div.foo').removeClass('removes each word')

text(content) ⇒ DomQuery

Iterate over each element in the DomQuery list and add the text provided as innerText on the element.

Param	Type	Description
content	String	String to be added as innerText

Example

pendo.dom('div.foo').text('hello there');

toggleClass(classNames) ⇒ DomQuery

Iterate over each element and toggle each class name on or off depending on the the current state of the element.

Param	Type	Description
classNames	String	Space separated string of classnames.

Example

pendo.dom('div.foo').toggleClass('adds or removes each class')

width(width) ⇒ DomQuery

Set the width or unset the width for the first element in the list

Param	Type	Description
width	Number	The new width to set. Undefined will remove the width allow it to auto determined.

Example

pendo.dom('div.foo').width(100)

Example

pendo.dom('div.foo).width()