Range.surroundContents
Range.surroundContents() 方法将 Range 对象的内容移动到一个新的节点,并将新节点放到这个范围的起始处。
这个方法与 newNode.appendChild(range.extractContents()); range.insertNode(newNode) 等价。应用以后, newNode 包含在 range 的边界点中。
然而,如果 Range 断开了一个非 Text 节点,只包含了节点的其中一个边界点,就会抛出异常。也就是说,不像上述的等价方法,如果节点仅有一部分被选中,则不会被克隆,整个操作会失败。
语法
range.surroundContents(newParent);
参数
newParent- 
    
一个包含内容的
Node。 
示例
HTML
<span class="header-text">Put this in a headline</span>
JavaScript
const range = document.createRange();
const newParent = document.createElement('h1');
range.selectNode(document.querySelector('.header-text'));
range.surroundContents(newParent);
结果
规范
| Specification | 
|---|
| DOM Standard  # dom-range-surroundcontents  | 
浏览器兼容性
BCD tables only load in the browser