Set selection by range in Javascript

Question

I want to select text by sending location/anchorOffset and length/offset using Javascript Here is my code

  var node = document.getElementById("content");    var range = document.createRange();    range.setStart(node, 0);    range.setEnd(node, 4); // here 0 and 4 is my location and length for the selection        // if my string is "This is test string" in my case its must select "This"     var selection = window.getSelection();    selection.removeAllRanges();     selection.addRange(range); 

But the issue is with range.setStart and range.setEnd its not working as I expect

Answer 1

The setStart() and setEnd() methods of DOM Range are well specified, so you could find the answer by reading the spec or MDN.

To summarise, if you want to specify a range boundary in terms of character offsets, you need to deal with a text node rather than an element. If your element contains a single text node, changing the first line of your code to the following will work:

var node = document.getElementById("content").firstChild; 

Answer 2

Here's a good solution if you're trying to select a jquery result set

var $newSelection = $('.someElements'); var selection = window.getSelection(); var range = document.createRange(); range.setStartBefore($newSelection.first()[0]); range.setEndAfter($newSelection.last()[0]); selection.removeAllRanges(); selection.addRange(range);