wrap
1.6
Element.wrap(element, wrapper[, attributes]) -> HTMLElement
someElement.wrap(wrapper[, attributes]) -> HTMLElement
Wraps an element inside another, then returns the wrapper.
Using wrap
as an instance method (e.g., $('foo').wrap('p')
) causes errors in Internet Explorer when used on textarea
elements. The wrap
property is reserved on textarea
s as a proprietary extension to HTML. As a workaround, use the generic version instead (Element.wrap('foo', 'p')
).
If the given element exists on the page, Element#wrap
will wrap it in place — its position will remain the same.
The wrapper
argument can be either an existing HTMLElement
or a string representing the tag name of an element to be created. The optional attributes
argument can contain a list of attribute/value pairs that will be set on the wrapper using Element#writeAttribute
.
Examples
Original HTML
<table id="data">
<tr>
<th>Foo</th>
<th>Bar</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
</tr>
</table>
JavaScript
// approach 1:
var div = new Element('div', { 'class': 'table-wrapper' });
$('data').wrap(div);
// approach 2:
$('data').wrap('div', { 'class': 'table-wrapper' });
// examples are equivalent. both return the DIV.
Resulting HTML
<div class="table-wrapper">
<table id="data">
<tr>
<th>Foo</th>
<th>Bar</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
</tr>
</table>
</div>