Namespace $.dom.Element

Holds the DOM Element methods.
Defined in: core-dom.js.

Namespace Summary
Constructor Attributes	Constructor Name and Description
	$.dom.Element Holds the DOM Element methods.

Method Summary
Method Attributes	Method Name and Description
<static>	$.dom.Element.wrap(wrapper) Wrap the element inside a given wrapper.
<static>	$.dom.Element.wrapInner(wrapper) Wrap all the child nodes of the current element.

Namespace Detail

$.dom.Element

Holds the DOM Element methods.

By default, the global Element.prototype object is extended to contain all the methods defined in this namespace.

The global Text.prototype and Comment.prototype DOM objects are also extended. However, these two prototypes are only extended to contain the new $.dom.Element.wrap method.

All of these methods use their this object. As such, you need to pass the correct this object.

In the examples provided for each method we will assume that the objects defined are already extended. Thus code like element.wrap('<p>') can be written directly.

See:: $.dom.Node; $.dom.NodeList

Method Detail

<static> {Element} $.dom.Element.wrap(wrapper)

Wrap the element inside a given wrapper.

var elem = document.createElement('p');

document.body.appendChild(elem);

// Now the body would serialize to something like:
// <body><p></p></body>

var result = elem.wrap('<div>');

// Now result = the <div> node.
// The body would serialize to something like:
// <body><div><p></p></div></body>

var elem = document.createElement('p');

document.body.appendChild(elem);

// Now the body would serialize to something like:
// <body><p></p></body>

var wrapper = '<div id="test1">' +
              '<div id="test2">';

var result = elem.wrap(wrapper);

// Now result = the #test1 node.
// The body would serialize to something like:
// <body><div id="test1"><div id="test2"><p>
// </p></div></div></body>

var elem = document.createElement('p');

document.body.appendChild(elem);

// Now the body would serialize to something like:
// <body><p></p></body>

var wrapper1 = document.createElement('div'),
    wrapper2 = document.createElement('div');

wrapper1.id = 'test1';
wrapper1.appendChild(wrapper2);
wrapper2.id = 'test2';

var result = elem.wrap(wrapper1);

// Now result = wrapper1.
// The body would serialize to something like:
// <body><div id="test1"><div id="test2"><p>
// </p></div></div></body>

Parameters:

{Element|String} wrapper

The element or the string to use for wrapping the current element.

If the wrapper is an element, then it is be used as-is for wrapping.

If the wrapper is a string, it is be parsed as HTML code. Then, the firstElementChild of the DOM tree generated by the string becomes the wrapper.

For both cases the determined wrapper gets added to the parent node of the current element (the this object), if it's available.

The deepest child element of the wrapper is searched, so that the current element will be appended into it.

Throws:
{TypeError}: If the current node is not an element/text/comment node. This method cannot wrap other kinds of objects.
{ReferenceError}: If the wrapper is a string and the current element has no owner document.
{ReferenceError}: If the wrapper is a string with no elements in it.

Returns:: {Element} The wrapper element.

See:: $.dom.Element.wrapInner

<static> {NodeList} $.dom.Element.wrapInner(wrapper)

Wrap all the child nodes of the current element.

The wrapper argument is the same as for $.dom.Element.wrap.

var child1 = document.createElement('p'),
    child2 = document.createElement('p');

child1.id = 'child1';
child2.id = 'child2';

document.body.appendChild(child1);
document.body.appendChild(child2);
// Now the body contains the two children.

var result = document.body.wrapInner('<div>');
// Now result is a NodeList containing child1
// and child2.

// The body would serialize to something like:
// <body><div><p id="child1"></p>
// <p id="chil2"></p></div></body>

Parameters:
{Element|String} wrapper: The element or the string to use for wrapping the child nodes of the current element.

Throws:
{TypeError}: If the current node is not an element node. This method cannot wrap other kinds of objects.
{ReferenceError}: If the wrapper is a string and the current element has no owner document.
{ReferenceError}: If the wrapper is a string with no elements in it.

Returns:: {NodeList} The list of wrapped child nodes. (wrapper.childNodes)

See:: $.dom.Element.wrap

Classes

Namespace $.dom.Element