Selection::addRange very slow in large DOM

Question

Is there any alternative to document.getSelection().addRange()?

In a content editable frame containing divs, it gets slower as we go down the divs.

Answer 1

Are you running removeAllRanges first? The MDN article and this SO answer make it seem like that call is required / recommended.

An example script from the MDN article:

/* Select all STRONG elements in an HTML document */

var strongs = document.getElementsByTagName("strong");
var s = window.getSelection();

if(s.rangeCount > 0) s.removeAllRanges();

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