在一个元素的外部包裹一个 DOM 元素
使用指定的 DOM 元素来包裹每个被选元素
使用普通JavaScript将给定元素包装在新容器元素中:
// element that will be wrapped
var el = document.querySelector('div.wrap_me');
// create wrapper container
var wrapper = document.createElement('div');
// insert wrapper before el in the DOM tree
el.parentNode.insertBefore(wrapper, el);
// move el into wrapper
wrapper.appendChild(el);
将这个操作封装为通用辅助函数
function wrap(el, wrapper) {
el.parentNode.insertBefore(wrapper, el);
wrapper.appendChild(el);
}
// example: wrapping an anchor with class "wrap_me" into a new div element
wrap(document.querySelector('a.wrap_me'), document.createElement('div'));
这个方法可以用于替换 jQuery 的 $.wrap()
and $.wrapAll()
方法