Javascript 在不设置样式表值的情况下查找DIV的顶部和左侧值

我正在制作一个绘图应用程序，包括点击一个div框并读取坐标值。到目前为止，它的问题是相对于长方体的坐标值不正确

这是我的设置。。绘图应用程序首先加载简单的HTML，然后加载专门用于绘图的DIV。然后我使用点击处理程序来检测点击并返回坐标

宽度和高度返回很好，因为我为DIV定义了它们，但顶部和左侧位置在javascript中返回NaN

我知道我可以通过对DIV使用css property position=absolute并以这种方式指定left和top来轻松实现这一点，但这会破坏HTML文档的其余部分，因为这样整个内容看起来就不合适了

有没有一种方法可以在不显式指定DIV的两个值的情况下获取DIV的左上角值

我想用简单的javascript实现这一点。没有jquery

---

看一看-我从未想过我必须使用getBoundingClientRect来获取坐标，但谢谢。

function getXY( ev ){
  var gbc = this.getBoundingClientRect(),
      X = ev.clientX - gbc.left,
      Y = ev.clientY - gbc.top;
  alert( X +' '+ Y);
}

document.getElementById('board').onclick = getXY;