获取元素“全局”坐标

问：

我正在编写一个 chrome 扩展程序来更改键盘导航的工作方式。基本上，我使用键来导航按钮、链接、输入字段等。当我必须获取元素“坐标”时，我的问题就开始了，我为此使用 并使用 和 获取元素角。w,a,s,delement.getBoundingClientRect();element.offsetWidthelement.offsetHeight

我正在stackoverflow主页上测试我的扩展。页面的左上角元素被选中，使用键绑定，我可以通过标题进行导航。我的问题是，扩展程序没有转到正确的元素，而是跳转到搜索栏。在查看日志时，我能够看到元素的角落。

在此处输入图像描述

上一个元素是菜单按钮，有问题的元素是搜索栏。角落看起来很不对劲，在页面中，它们完全处于同一水平，但是当我得到角落时，它就完全消失了。

有没有办法获得元素的 abosolute 坐标？

这是我获取正确元素的函数：

function getRightItem(){
  
  xDiff = Infinity;
  yDiff = Infinity;

  let iterationElement = null;
  
  let myBottom = focusedElementPosition.y + focusedElement.offsetHeight;
  let myRight = focusedElementPosition.x + focusedElement.offsetWidth;
  let myLeft = focusedElementPosition.x;
  let myTop = focusedElementPosition.y;

  console.log("previous element", {"bottom": myBottom,"right": myRight,"left": myLeft,"top": myTop});
  
  for (const [mapKey, innerMap] of clickable.entries()) {
    if (innerMap.size > 0) {
      for (const [element, position] of innerMap.entries()) {
        var bottom = position.y + element.offsetHeight;
        var right = position.x + element.offsetWidth;
        var left = position.x;
        var top = position.y;
        
        if(left < xDiff && left > myRight){
          if(top < yDiff){
            xDiff = left;
            yDiff = top;
            iterationElement = [element, position];
          }
        }
      }
    }
  }
  focusedElement.style.border = "";
  console.log("element in question", {"bottom": bottom,"right": right,"left": left,"top": top});
  
  setNewElement(iterationElement);
}

如果有人需要，这是我的功能setNewElement()

function setNewElement(element){
  focusedElement = element[0];
  focusedElementPosition = {"x":element[1].x, "y":element[1].y};
  focusedElement.focus();
}

我尝试使用 css 位置值（右、上、左、下），以为它会抓取绝对坐标，但事实证明并非所有元素都定义了这些坐标