Caph Class: Element

new Element(element)

A class which provides DOM related functions such as manipulation and traversing.

Parameters:

Name	Type	Description
`element`	Array.<HTMLElement> \| HTMLElement \| caph.dom.Element \| String	A HTMLElement in the DOM or a caph.dom.Element object or a HTML string.

Since:

2.0.0

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.addClass('cls');
 
 var elements = new caph.dom.Element(document.getElementsByTagName('div'));
 elements.attr('name', 'test');
 
 var div = new caph.dom.Element('<div>Test</div>');
 div.style({
     'color': 'white',
     'background-color': 'black'
 });

Methods

<static> createElement(element) → {Array.<HTMLElement>}

Creates the element by given the HTML string.

Parameters:

Name	Type	Description
`element`	String	A HTML string.

Since:

2.0.0

Returns:

An array of element.

Type: Array.<HTMLElement>

Example

var element = caph.dom.Element.createElement('<div>Test</div>');

addClass(className) → {caph.dom.Element}

Adds the specified class(es) to each of the set of matched elements.

Parameters:

Name	Type	Description
`className`	Array.<String> \| String	The class(es) to be added to the class attribute of the matched elements.

Since:

2.0.0

See:

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.addClass('class1');
 element.addClass(['class2', 'class3']);

after(element) → {caph.dom.Element}

Inserts content, specified by the parameter, after each element in the set of matched elements.

Parameters:

Name	Type	Description
`element`	String \| HTMLElement \| caph.dom.Element	HTML string, HTML element or caph.dom.Element object to insert after each element in the set of matched elements.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element1 = new caph.dom.Element(document.getElementById('id1'));
 var element2 = new caph.dom.Element(document.getElementById('id2'));
 
 element.after('<div></div>');
 element.after(element2);

append(element) → {caph.dom.Element}

Inserts content, specified by the parameter, to the end of each element in the set of matched elements.

Parameters:

Name	Type	Description
`element`	String \| HTMLElement \| caph.dom.Element	HTML string, HTML element or caph.dom.Element object to insert at the end of each element in the set of matched elements.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element1 = new caph.dom.Element(document.getElementById('id1'));
 var element2 = new caph.dom.Element(document.getElementById('id2'));
 
 element1.append('<div></div>');
 element1.append(element2);

attr(name, value) → {String|caph.dom.Element}

Gets the value of an attribute for the first element in the set of matched elements or sets a attribute for every matched element.

Parameters:

Name	Type	Argument	Description
`name`	String \| Object		The name of the attribute to get or set. This parameter also can be a key/value pair object to set.
`value`	String	<optional>	A value to set for the attribute. If not passed, gets the value of given name parameter attribute for the first element.

Since:

2.0.0

Returns:

If value parameter is passed or name parameter is an object, the current object. If not, the value of an attribute for the first element.

Type: String | caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.attr('data-next', element.attr('data-prev'));
 element.attr({
     'data-test1': 1,
     'data-test2': 2
 });

before(element) → {caph.dom.Element}

Inserts content, specified by the parameter, before each element in the set of matched elements.

Parameters:

Name	Type	Description
`element`	String \| HTMLElement \| caph.dom.Element	HTML string, HTML element or caph.dom.Element object to insert before each element in the set of matched elements.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element1 = new caph.dom.Element(document.getElementById('id1'));
 var element2 = new caph.dom.Element(document.getElementById('id2'));
 
 element.before('<div></div>');
 element.before(element2);

bind(type, listener, capture) → {caph.dom.Element}

Attaches a handler to an event for the matched elements.

Parameters:

Name	Type	Argument	Description
`type`	String		A string containing a DOM event types, such as 'click' or 'submit,' or custom event names.
`listener`	function		A function to execute each time the event is triggered.
`capture`	Boolean	<optional>	Indicates that the user wishes to initiate capture.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.bind('click', function(event) {
     console.log('click!');
 });

border() → {Object}

Gets the first element's border.

Since:

2.0.0

Returns:

An object containing the properties left, right, top and left.

Type: Object

Example

var element = new caph.dom.Element(document.getElementById('id'));
 var border = elelment.border();
 var verticalBorder = border.top + border.bottom;

children(filter) → {caph.dom.Element}

Gets the children of each element in the set of matched elements, optionally filtered by a function.

Parameters:

Name	Type	Argument	Description
`filter`	function \| String	<optional>	A function containing a condition or a selector string to match elements against.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 element.children().addClass('class');
 element.children(function(item) {
     return item.tagName === 'span'; 
 }).addClass('class2');
 element.children('[title]').addClass('class3');

clone() → {caph.dom.Element}

Creates a deep copy of the set of matched elements.

Since:

2.0.0

Returns:

The cloned object.

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 var element2 = element.clone();

delegate(type, listener, filter) → {caph.dom.Element}

Attaches a handler to an event for the elements that match the filter, now or in the future, based on a specific root element.

Parameters:

Name	Type	Description
`type`	String	A string containing a DOM event types, such as 'click' or 'submit,' or custom event names.
`listener`	function	A function to execute each time the event is triggered.
`filter`	function \| String	A function containing a condition or a selector string to match elements against.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

new caph.dom.Element(document.getElementById('id1')).delegate('click', function(event) {
     console.log('click! 1');
 }, function(target) {
     return new caph.dom.Element(target).hasClass('class1');
 });
 
 new caph.dom.Element(document.getElementById('id2')).delegate('click', function(event) {
     console.log('click! 2');
 }, '.class2');

each(callback) → {caph.dom.Element}

Iterates over a caph.dom.Element object, executing a function for each matched element. If the function returns false, next iteration will stop.

Parameters:

Name	Type	Description
`callback`	function	A function to execute for each matched element.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 element.each(function(index, item) {
     if (new caph.dom.Element(item).hasClass('class')) {
         return false;
     }
 });

eq(index) → {caph.dom.Element}

Reduces the set of matched elements to the one at the specified index.

Parameters:

Name	Type	Description
`index`	Number	An integer indicating the 0-based position of the element.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 element.eq(0).addClass('class');

equal(element) → {Boolean}

Determines whether each element in the set of matched elements is same as the given elements.

Parameters:

Name	Type	Description
`element`	HTMLElement \| caph.dom.Element	To compare with the set of matched elements.

Since:

2.0.0

Returns:

Type: Boolean

Example

new caph.dom.Element(document.getElementById('id1')).equal(new caph.dom.Element(document.getElementById('id2'))); // false

find(selector, filter) → {caph.dom.Element}

Gets the descendants of each element in the set of matched elements, filtered by a selector.

Parameters:

Name	Type	Argument	Description
`selector`	String		A string containing a selector expression to match elements against. See http://www.w3schools.com/cssref/css_selectors.asp for more details.
`filter`	function	<optional>	A function containing a condition to match elements against.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.find('div').addClass('class');
 element.find('div', function(item) {
     return item.childNodes.length > 10;
 }).addClass('class2');

first() → {caph.dom.Element}

Reduces the set of matched elements to the first one in the set.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 element.first().addClass('class');

firstChild() → {caph.dom.Element}

Gets the first child of each element in the set of matched elements.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.firstChild().addClass('class');

get(index) → {Array.<HTMLElement>|HTMLElement}

Retrieves the matched DOM elements.

Parameters:

Name	Type	Argument	Description
`index`	Number	<optional>	A zero-based integer indicating which element to retrieve. If not passed, returns all elements.

Since:

2.0.0

Returns:

Type: Array.<HTMLElement> | HTMLElement

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 new caph.dom.Element(element.get(0)).addClass('class');

hasClass(className) → {Boolean}

Determines whether any of the matched elements are assigned the given class.

Parameters:

Name	Type	Description
`className`	Array.<String> \| String	The class name(s) to search for.

Since:

2.0.0

See:

Returns:

Type: Boolean

Example

var element = new caph.dom.Element(document.getElementById('id'));
 var hasClass1 = element.hasClass('class1');
 var hasClass2Or3 = element.hasClass(['class2', 'class3']);

height(value) → {Number|caph.dom.Element}

Gets the current computed height for the first element in the set of matched elements or sets the height of every matched element.

Parameters:

Name	Type	Argument	Description
`value`	Number	<optional>	An integer representing the number of pixels.

Since:

2.0.0

Returns:

If value parameter is passed, the current object. If not, the current computed height for the first element.

Type: Number | caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.height(element.height() + 100);

hide() → {caph.dom.Element}

Hides the matched elements.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.hide();

html(str) → {String|caph.dom.Element}

Gets the HTML contents of the first element in the set of matched elements or sets the HTML contents of every matched element.

Parameters:

Name	Type	Argument	Description
`str`	String	<optional>	A string of HTML to set as the content of the element. If not passed, gets the HTML contents of the first element.

Since:

2.0.0

Returns:

If str parameter is passed, the current object. If not, the HTML contents of the first element.

Type: String | caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.html('<div>' + element.html() + '</div>');

innerHeight() → {Number}

Gets the current computed height for the first element in the set of matched elements, including padding but not border.

Since:

2.0.0

Returns:

The current computed inner height for the first element.

Type: Number

Example

var element = new caph.dom.Element(document.getElementById('id'));
 var innerHeight = element.innerHeight();

innerWidth() → {Number}

Gets the current computed width for the first element in the set of matched elements, including padding but not border.

Since:

2.0.0

Returns:

The current computed inner width for the first element.

Type: Number

Example

var element = new caph.dom.Element(document.getElementById('id'));
 var innerWidth = element.innerWidth();

isNodeName(name) → {Boolean}

Determines whether the first element name in the set of matched elements is equal to the given name.

Parameters:

Name	Type	Description
`name`	String	A string to compare with the first element name.

Since:

2.0.0

Returns:

Type: Boolean

Example

var element = new caph.dom.Element(document.getElementById('id'));
 var isDiv = element.isNodeName('div');

last() → {caph.dom.Element}

Reduces the set of matched elements to the final one in the set.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 element.last().addClass('class');

map(callback) → {Array}

Passes each element in the current matched set through a function, producing a new array containing the return values.

Parameters:

Name	Type	Description
`callback`	function	A function object that will be invoked for each element in the current set.

Since:

2.0.0

Returns:

Type: Array

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 var attrList = element.map(function(index, item) {
     return new caph.dom.Element(item).attr('data-item');
 });

margin() → {Object}

Gets the first element's margin.

Since:

2.0.0

Returns:

An object containing the properties left, right, top and left.

Type: Object

Example

var element = new caph.dom.Element(document.getElementById('id'));
 var margin = elelment.margin();
 var verticalMargin = margin.top + margin.bottom;

next(filter) → {caph.dom.Element}

Gets the immediately following sibling of each element in the set of matched elements.

Parameters:

Name	Type	Argument	Description
`filter`	function \| String	<optional>	A function containing a condition or a selector string to match elements against.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 element.next().addClass('class');
 element.next(function(item) {
     return item.tagName === 'div'; 
 }).addClass('class2');
 element.next('[title]').addClass('class3');

offset(coordinates) → {Object|caph.dom.Element}

Gets the current coordinates of the first element, or sets the coordinates of every element, in the set of matched elements, relative to the document.

Parameters:

Name	Type	Argument	Description
`coordinates`	Object	<optional>	An object containing the properties top and left, which are numbers indicating the new top and left coordinates for the matched elements.

Since:

2.0.0

Returns:

If coordinates parameter is passed, the current object. If not, an object containing the properties top and left, which are numbers indicating the current coordinates of the first element.

Type: Object | caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 var offset = element.offset();
 element.offset({
     left: offset.left + 200,
     top: offset.top + 100
 });

outerHeight(includeMargin) → {Number}

Gets the current computed height for the first element in the set of matched elements, including padding, border, and optionally margin.

Parameters:

Name	Type	Argument	Description
`includeMargin`	Boolean	<optional>	A Boolean indicating whether to include the first element's margin in the calculation.

Since:

2.0.0

Returns:

The current computed outer height for the first element.

Type: Number

Example

var element = new caph.dom.Element(document.getElementById('id'));
 var outerHeight = element.outerHeight();
 var outerHeightIncludeMargin = element.outerHeight(true);

outerHtml() → {Array.<String>|String}

Gets the HTML outer contents of the set of matched element(s).

Since:

2.0.0

Returns:

An array or a string of the set of matched element(s).

Type: Array.<String> | String

Example

var outerHtml = new caph.dom.Element(document.getElementById('id')).outerHtml();

outerWidth(includeMargin) → {Number}

Gets the current computed width for the first element in the set of matched elements, including padding, border, and optionally margin.

Parameters:

Name	Type	Argument	Description
`includeMargin`	Boolean	<optional>	A Boolean indicating whether to include the first element's margin in the calculation.

Since:

2.0.0

Returns:

The current computed outer width for the first element.

Type: Number

Example

var element = new caph.dom.Element(document.getElementById('id'));
 var outerWidth = element.outerWidth();
 var outerWidthIncludeMargin = element.outerWidth(true);

padding() → {Object}

Gets the first element's padding.

Since:

2.0.0

Returns:

An object containing the properties left, right, top and left.

Type: Object

Example

var element = new caph.dom.Element(document.getElementById('id'));
 var padding = elelment.padding();
 var verticalPadding = padding.top + padding.bottom;

parent(filter) → {caph.dom.Element}

Gets the parent of each element in the set of matched elements.

Parameters:

Name	Type	Argument	Description
`filter`	function \| String	<optional>	A function containing a condition or a selector string to match elements against.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementsByTagName('span'));
 element.parent().addClass('class');
 element.parent(function(item) {
     return item.tagName === 'div'; 
 }).addClass('class2');
 element.parent('[title]').addClass('class3');

position() → {Object}

Gets the current coordinates of the first element in the set of matched elements, relative to the offset parent.

Since:

2.0.0

Returns:

An object containing the properties top and left, which are numbers indicating the current coordinates of the first element.

Type: Object

Example

var element = new caph.dom.Element(document.getElementById('id'));
 var position = element.position();
 
 var left = position.left;
 var top = position.top;

prepend(element) → {caph.dom.Element}

Inserts content, specified by the parameter, to the beginning of each element in the set of matched elements.

Parameters:

Name	Type	Description
`element`	String \| HTMLElement \| caph.dom.Element	HTML string, HTML element or caph.dom.Element object to insert at the beginning of each element in the set of matched elements.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element1 = new caph.dom.Element(document.getElementById('id1'));
 var element2 = new caph.dom.Element(document.getElementById('id2'));
 
 element1.prepend('<div></div>');
 element1.prepend(element2);

prev(filter) → {caph.dom.Element}

Gets the immediately preceding sibling of each element in the set of matched elements.

Parameters:

Name	Type	Argument	Description
`filter`	function \| String	<optional>	A function containing a condition or a selector string to match elements against.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 element.prev().addClass('class');
 element.prev(function(item) {
     return item.tagName === 'div'; 
 }).addClass('class2');
 element.prev('[title]').addClass('class3');

remove()

Removes the set of matched elements from the DOM.

Since:

2.0.0

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 element.remove();

removeAttr(name) → {caph.dom.Element}

Removes an attribute from each element in the set of matched elements.

Parameters:

Name	Type	Description
`name`	Array.<String> \| String	The name of the attribute(s) to remove.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.removeAttr('data-test');
 element.removeAttr(['data-prev', 'data-next']);

removeClass(className) → {caph.dom.Element}

Removes one or more classes from each element in the set of matched elements.

Parameters:

Name	Type	Description
`className`	Array.<String> \| String	The class(es) to be removed from the class attribute of the matched elements.

Since:

2.0.0

See:

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.removeClass('class1');
 element.removeClass(['class2', 'class3']);

scrollLeft(value) → {Number|caph.dom.Element}

Gets the current horizontal position of the scroll bar for the first element in the set of matched elements or sets the horizontal position of the scroll bar for every matched element.

Parameters:

Name	Type	Argument	Description
`value`	Number	<optional>	An integer indicating the new position to set the scroll bar to.

Since:

2.0.0

Returns:

If value parameter is passed, the current object. If not, an integer indicating the current horizontal position of the scroll bar for the first element.

Type: Number | caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.scrollLeft(element.scrollLeft() + 100);

scrollTop(value) → {Number|caph.dom.Element}

Gets the current vertical position of the scroll bar for the first element in the set of matched elements or sets the vertical position of the scroll bar for every matched element.

Parameters:

Name	Type	Argument	Description
`value`	Number	<optional>	An integer indicating the new position to set the scroll bar to.

Since:

2.0.0

Returns:

If value parameter is passed, the current object. If not, an integer indicating the current vertical position of the scroll bar for the first element.

Type: Number | caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.scrollTop(element.scrollTop() + 100);

show(type) → {caph.dom.Element}

Displays the matched elements.

Parameters:

Name	Type	Argument	Description
`type`	String	<optional>	A value to set for the display style property.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element1 = new caph.dom.Element(document.getElementById('id1'));
 var element2 = new caph.dom.Element(document.getElementById('id2'));
 
 element1.show();
 element2.show('inline');

siblings(filter) → {caph.dom.Element}

Gets the siblings of each element in the set of matched elements, optionally filtered by a function.

Parameters:

Name	Type	Argument	Description
`filter`	function \| String	<optional>	A function containing a condition or a selector string to match elements against.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 element.siblings().addClass('class');
 element.siblings(function(item) {
     return item.tagName === 'div'; 
 }).addClass('class2');
 element.siblings('[title]').addClass('class3');

slice(start, end) → {caph.dom.Element}

Reduces the set of matched elements to a subset specified by a range of indices. If parameters are not passed, returns all elements.

Parameters:

Name	Type	Argument	Description
`start`	Number	<optional>	An integer indicating the 0-based position at which the elements begin to be selected.
`end`	Number	<optional>	An integer indicating the 0-based position at which the elements stop being selected.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 element.slice(0, 2).addClass('class');

style(property, value) → {String|caph.dom.Element}

Gets the value of a style property for the first element in the set of matched elements or sets a style property for every matched element. The style property name is not a camelcase but is same as css property name.

Parameters:

Name	Type	Argument	Description
`property`	String \| Object		A style property name or style property name-value pair object.
`value`	String	<optional>	A value to set for the property. If not passed, gets the value of a style property for the first element

Since:

2.0.0

Returns:

If value parameter is passed or property parameter is an object, the current object. If not, the value of a style property for the first element.

Type: String | caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.style('background-color', element.style('color'));
 element.style({
     'transform': 'translate3d(100px, 100px, 0)',
     'transition': 'transform 1s'
 });

text(str) → {String|caph.dom.Element}

Gets the combined text contents of each element in the set of matched elements, including their descendants, or sets the text contents of the matched elements.

Parameters:

Name	Type	Argument	Description
`str`	String	<optional>	The text to set as the content of each matched element. If not passed, gets a string containing the combined text of all matched elements.

Since:

2.0.0

Returns:

If str parameter is passed, the current object. If not, a string containing the combined text of all matched elements.

Type: String | caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.text('Hello! ' + element.text());

toggle(type) → {caph.dom.Element}

Displays or hides the matched elements.

Parameters:

Name	Type	Argument	Description
`type`	String	<optional>	A value to set for the display style property.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.toggle();

toggleClass(className) → {caph.dom.Element}

Adds or removes one or more classes from each element in the set of matched elements, depending on either the class’s presence or the value of the switch argument.

Parameters:

Name	Type	Description
`className`	Array.<String> \| String	The class name to be toggled for the element.

Since:

2.0.0

See:

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.toggleClass('class1');
 element.toggleClass(['class2', 'class3']);

transform() → {caph.animation.Transform}

Performs simple animations such as rotate, move, scale and opacity to the first element in the set of matched elements using CSS3 transform. See caph.animation.Transform for more details.

Since:

2.0.0

Returns:

Type: caph.animation.Transform

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.transform().move(100, 0, 0, 1000).start();

trigger(type, prop) → {caph.dom.Element}

Executes all handlers attached to the matched elements for the given event type.

Parameters:

Name	Type	Argument	Description
`type`	String		A string containing a DOM event types, such as 'click' or 'submit,' or custom event names.
`prop`	Object	<optional>	Additional parameters to pass along to the event handler.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.bind('click', function(event) {
     console.log('click!');
 });
 
 element.trigger('click');
 element.trigger('click', {
     clientX: 10,
     clientY: 20
 });

unbind(type) → {caph.dom.Element}

Removes attached handlers to an event for the matched elements.

Parameters:

Name	Type	Argument	Description
`type`	String	<optional>	A string containing a DOM event types, such as 'click' or 'submit,' or custom event names. If not passed, all event types are removed.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.bind('click', function(event) {
     console.log('click!');
 });
 element.bind('keydown', function(event) {
     console.log('keydown!');
 });
 element.bind('keyup', function(event) {
     console.log('keyup');
 });
 
 element.unbind('click');
 element.unbind(); // remove all

undelegate(type, selector) → {caph.dom.Element}

Removes a handler from the event for elements which match the current filter, based upon a specific root element.

Parameters:

Name	Type	Argument	Description
`type`	String		A string containing a DOM event types, such as 'click' or 'submit,' or custom event names. If blank value (null, undefined, '') is passed, all event types are removed.
`selector`	String	<optional>	A selector string to match elements against.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element1 = new caph.dom.Element(document.getElementById('id1')).delegate('click', function(event) {
     console.log('click! 1');
 }, function(target) {
     return new caph.dom.Element(target).hasClass('class1');
 });
 
 var element2 = new caph.dom.Element(document.getElementById('id2')).delegate('click', function(event) {
     console.log('click! 2');
 }, '.class2');
 
 element1.undelegate('click');
 element1.undelegate(); // remove all
 
 element2.undelegate('click', '.class2');
 element2.undelegate('', '.class2'); // remove all

unwrap() → {caph.dom.Element}

Removes the parents of the set of matched elements from the DOM, leaving the matched elements in their place.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 element.unwrap();

width(value) → {Number|caph.dom.Element}

Gets the current computed width for the first element in the set of matched elements or sets the width of every matched element.

Parameters:

Name	Type	Argument	Description
`value`	Number	<optional>	An integer representing the number of pixels.

Since:

2.0.0

Returns:

If value parameter is passed, the current object. If not, the current computed width for the first element.

Type: Number | caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementById('id'));
 element.width(element.width() + 100);

wrap(element) → {caph.dom.Element}

Wraps an HTML structure around each element in the set of matched elements.

Parameters:

Name	Type	Description
`element`	String \| HTMLElement \| caph.dom.Element	HTML string, HTML element or caph.dom.Element object specifying the structure to wrap around each element in the set of matched elements.

Since:

2.0.0

Returns:

Type: caph.dom.Element

Example

var element = new caph.dom.Element(document.getElementsByTagName('div'));
 element.wrap('<div></div>');