how do I get co-ordinates of selected text in an html using javascript document.getSelecttion()

问题

I would like to position element above selected text. But I am not able to figure out the coordinates.

var sel = document.getSelection();
  if(sel != null) {
    positionDiv();
}

Example: (image)

回答1:

Here is the basic idea. You insert dummy element in the beginning of the selection and get the coordinates of that dummy html element. Then you remove it.

var range = window.getSelection().getRangeAt(0);
var dummy = document.createElement("span");
range.insertNode(dummy);
var box = document.getBoxObjectFor(dummy);
var x = box.x, y = box.y;
dummy.parentNode.removeChild(dummy);

来源：https://stackoverflow.com/questions/2605133/how-do-i-get-co-ordinates-of-selected-text-in-an-html-using-javascript-document