Range()

Experimental: 这是一个实验中的功能
此功能某些浏览器尚在开发中，请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订，所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

构造函数 Range() 返回一个新创建的 Range 对象，新创建的对象属于全局 Document 对象。

语法

range = new Range()

示例

在下面的例子中，我们通过构造函数Range()创建了一个新的 range，并且使用Range.setStartBefore() 和Range.setEndAfter() (en-US) 分别设置了起始位置。然后，通过方法window.getSelection()和Selection.addRange()选中了选区 range。

HTML

<p>First paragraph.</p>
<p>Second paragraph.</p>
<p>Third paragraph.</p>
<p>Fourth paragraph.</p>

JavaScript

const paragraphs = document.querySelectorAll('p');

// 创建 Range 对象
const range = new Range();

// Range 起始位置在段落 2
range.setStartBefore(paragraphs[1]);

// Range 结束位置在段落 3
range.setEndAfter(paragraphs[2]);

// 获取 selection 对象
const selection = window.getSelection();

// 添加光标选择的范围
selection.addRange(range);

Result

规范

Specification
DOM Standard # ref-for-dom-range-range②

浏览器兼容性

BCD tables only load in the browser

扩展

The DOM interfaces index (en-US)