在一个元素的外部包裹一个 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()方法