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

参见