关于getBoundingClientRect，.getSelection，.getRangeAt的困惑

Question

我使用.getSelection获取选定的文本，然后使用.getRangeAt(0)，然后使用.getBoundingClientRect()获取窗口的位置。

下面是我的工作代码。

function getText(){
  if(window.getSelection) {
    return window.getSelection();
  } 
}

$("#textArea").mouseup(function(){
    var selection = getText();
    var oRange = selection.getRangeAt(0);
    var oRect = oRange.getBoundingClientRect();

    var left = oRect.left
    var top = oRect.top
}

我的问题是：

为什么我“不能”直接用喜欢？

mySelectedText.getSelection().getBoundingClientRect();

为什么我要使用.getRangeAt()；

这三种功能的区别是什么？

1. .getSelection
2. .getRangeAt
3. .getBoundingClientRect

Answer 1

getBoundingClientRect是任何元素的偏移量，getSelection和getRangeAt与插入符号一起工作，而不返回它们返回选择对象和范围对象的元素。