Selection.addRange() - Web APIs 编辑

Experimental

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The Selection.addRange() method adds a Range to a Selection.

Syntax

selection.addRange(range);

Parameters

range

A Range object that will be added to the Selection.

Example

Currently only Firefox supports multiple selection ranges, other browsers will not add new ranges to the selection if it already contains one.

HTML

<p>I <strong>insist</strong> that you <strong>try</strong> selecting the <strong>strong words</strong>.</p>
<button>Select strong words</button>

JavaScript

let button = document.querySelector('button');

button.addEventListener('click', function () {
  let selection = window.getSelection();
  let strongs = document.getElementsByTagName('strong');

  if (selection.rangeCount > 0) {
    selection.removeAllRanges();
  }

  for (let i = 0; i < strongs.length; i++) {
    let range = document.createRange();
    range.selectNode(strongs[i]);
    selection.addRange(range);
  }
});

Result

Specifications

Browser compatibility

BCD tables only load in the browser

See also

• Selection, the interface this method belongs to