ElementWrapper Class
Class that wraps DOM elements and provides additional functionality. Should not be constructed directly - Instead use wrap or create
Constructor
ElementWrapper
()
Item Index
Methods
- _getByClass
- addClass
- addDelegate
- addEvent
- append
- appendChild
- children
- cloneNode
- firstByClass
- firstBySelector
- firstByTag
- get
- getAttribute
- getByClass
- getBySelector
- getByTag
- getElementId
- getPosition
- hasClass
- insertAfter
- next
- parent
- prependChild
- previous
- remove
- removeChild
- removeClass
- set
- setAttribute
- setStyle
- setStyles
Properties
Methods
_getByClass
-
el
-
className
Internal function for getting elements by class name. Don't use externally (use getByClass instead)
Parameters:
-
el
HTMLElementElement to search the children of
-
className
StringName of the class to search for
Returns:
addClass
-
name
Add the specified class name to this element
Parameters:
-
name
StringClass name to add
addDelegate
-
type
-
tagName
-
className
-
fn
Add a delegated event handler to this element. Attach a handler to all tagNames with a class of className, by attaching the event listener to "this" element. Works for both current elements, and new elements added in the future.
Parameters:
-
type
StringType of event listener (eg. "click")
-
tagName
StringTag name to add events to (eg. "a")
-
className
StringClass name to add events to, or null for none
-
fn
StringEvent handler function
addEvent
-
type
-
fn
Add an event handler to this element.
Parameters:
-
type
StringType of event handler (eg. "click")
-
fn
FunctionFunction for handling these events
append
-
html
Append some HTML to the element
Parameters:
-
html
StringHTML to append
Example:
$('container').append('<p>More content</p>');
appendChild
-
newNode
Append a new child to the end of this element
Parameters:
-
newNode
ElementWrapper | HTMLElementNode to append
children
()
Array of ElementWrapper
Get all the children of this element
Returns:
cloneNode
-
deep
Clone this element
Parameters:
-
deep
BooleanWhether to perform a deep clone
Returns:
firstByClass
-
className
-
[wrap=true]
Get the first child element by class name, or null if there is no matching child
Parameters:
-
className
StringClass name to look for
-
[wrap=true]
Boolean optionalWhether to wrap the element or not. Optional, default is true
Returns:
firstBySelector
-
selectors
-
[wrap=true]
Get the first child element by a selector or null if there is no matching child. Incomplete as there's not yet full IE support.
Parameters:
-
selectors
StringSelector to use
-
[wrap=true]
Boolean optionalWhether to wrap the elements or not. Optional, default is true
Returns:
firstByTag
-
tag
-
[wrap=true]
Get the first child element by tag name, or null if there is no matching child
Parameters:
-
tag
StringTag name to get
-
[wrap=true]
Boolean optionalWhether to wrap the element or not. Optional, default is true
Returns:
get
-
key
Get a property on this element
Parameters:
-
key
StringProperty name
Returns:
getAttribute
-
attribute
Get the value of the specified attribute
Parameters:
-
attribute
StringAttribute to get
Returns:
getByClass
-
className
-
[wrap=true]
Get all children by class name
Parameters:
-
className
StringClass name to look for
-
[wrap=true]
Boolean optionalWhether to wrap the elements or not. Optional, default is true
Returns:
getBySelector
-
selectors
-
[wrap=true]
Get all children by selector. Incomplete as there's not yet full IE support.
Parameters:
-
selectors
StringSelector to use
-
[wrap=true]
Boolean optionalWhether to wrap the elements or not. Optional, default is true
Returns:
getByTag
-
tag
-
[wrap=true]
Get all children by tag name
Parameters:
-
tag
StringTag name to get
-
[wrap=true]
Boolean optionalWhether to wrap the elements or not. Optional, default is true
Returns:
getElementId
()
String
Gets the internal element ID for this element. This is not the id in the HTML!
Returns:
getPosition
()
Object
Get the position of this element
Returns:
hasClass
-
name
Check if this element has the specified CSS class name
Parameters:
-
name
StringClass name to look for
Returns:
Example:
// HTML contains: <div id="test" class="hello">...</div>
$('test').hasClass('blah'); // false
$('test').hasClass('hello'); // true
insertAfter
-
Wrapped
Insert a DOM node after this node
Parameters:
-
Wrapped
ElementWrapperDOM node
Example:
// Insert a new element after #container
var containerEl = $('container');
var newEl = DOM.create('div', { id: 'helloWorld' });
containerEl.insertAfter(newEl);
next
()
ElementWrapper
Get the sibling element after this one
Returns:
parent
-
[tagName=null]
Get the parent element of this element. If a tag name is passed, get the first parent that matches this tag name, traversing the tree
Parameters:
-
[tagName=null]
String optionalName of tag to look for, or null to just get the first ancestor
Returns:
prependChild
-
New
Add a child to the start of this element
Parameters:
-
New
ElementWrapper | HTMLElementelement to add
previous
()
ElementWrapper
Get the sibling element before this one
Returns:
remove
()
Remove this element from the DOM.
removeChild
-
node
Remove the specified child from this element
Parameters:
-
node
ElementWrapper | HTMLElementChild node to remove
removeClass
-
name
Remove the specified class name from this element
Parameters:
-
name
StringClass name to remove
set
-
key
-
value
Set a property on this element
Parameters:
-
key
StringProperty name
-
value
StringValue to set
Example:
var containerEl = $('container');
containerEl.set('id', 'foobar'); // Changes ID of #container
setAttribute
-
attribute
-
value
Set the value of the specified attribute
Parameters:
-
attribute
StringAttribute to set
-
value
MixedValue to set attribute to
setStyle
-
style
-
value
Set a CSS style on this element
Parameters:
-
style
StringStyle to set
-
value
MixedNew style value
Example:
$('container').setStyle('backgroundColor', 'red');
setStyles
-
styles
Set multiple CSS styles at once
Parameters:
-
styles
ObjectStyles to set
Example:
$('container').setStyles({
backgroundColor: red,
fontSize: '18px'
});
Properties
element
HTMLElement
private
The element being wrapped