选择：removeAllRanges() 方法

Selection.removeAllRanges() 方法会移除选择中的所有范围，并将 anchorNode 和 focusNode 属性设置为 null，并且不会选择任何内容。当调用此方法时，会在文档上触发 selectionchange 事件。

注意：此方法是 Selection.empty() 方法的别名。

语法

js
removeAllRanges()

参数

无。

返回值

无 (undefined)。

示例

此示例在页面上选择或未选择内容时显示一条消息。它通过侦听文档上的 selectionchange 事件来实现这一点。还有一个按钮，通过调用 Selection.removeAllRanges() 来清除任何选择。发生这种情况时，选择会发生更改，并且消息会更新。

html
<p>
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse laoreet
  urna eget sapien venenatis, eget facilisis diam mattis.
</p>
<button>Clear selection</button>
<pre id="log"></pre>
js
const log = document.getElementById("log");

// The selection object is a singleton associated with the document
const selection = document.getSelection();

// Logs if there is a selection or not
function newSelectionHandler() {
  if (selection.rangeCount !== 0) {
    log.textContent = "Some text is selected.";
  } else {
    log.textContent = "No selection on this document.";
  }
}

document.addEventListener("selectionchange", () => {
  newSelectionHandler();
});

newSelectionHandler();

// The button cancel all selection ranges
const button = document.querySelector("button");
button.addEventListener("click", () => {
  selection.removeAllRanges();
});

规范

规范
Selection API
# dom-selection-removeallranges

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。

另请参阅