[Tech]JavaScript 取得物件正確座標

最近在重寫獨招程式，為了讓使用者方便修改資料，就採用Table + Div 的方式，
讓使用者點選某一列資料，即顯示該列資料於DIV容器中，但問題來了，要如何定位這個div容器?
問了google，但效果都不大好用，最後還是得拜讀大師的作品「JavaScript大全/5e」

以下程式碼是依我的程式需求有修改過，但本質不變
基本上是使用DOM Tree方式，由目標物件一直向上繞行至document.body
X軸和Y軸是分開取得的(也可寫一起，就隨個人啦)

function posX(objID) {
　　var elmt = document.getElementById(objID);
　　var x = 0;
　　//繞行 offsetParents
　　for (var e = elmt ; e ; e = e.offsetParent) {
　　　　//把 offsetLeft 值加總
　　　　x += e.offsetLeft;
　　}
　　//繞行至 document.body
　　for (e = elmt.parentNode; e && e != document.body; e = e.parentNode){
　　　　//減去捲軸值
　　　　if (e.scrollLeft) x -= e.scrollLeft;
　　}
　　return x;
}
--------------------------------------------------------------
function posY(objID) {
　　var elmt = document.getElementById(objID);
　　var y = 0;
　　//繞行 offsetParents
　　for (var e = elmt ; e ; e = e.offsetParent) {
　　　　//把 offsetTop 值加總
　　　　y += e.offsetTop;
　　}
　　//繞行至 document.body
　　for (e = elmt.parentNode; e && e != document.body; e = e.parentNode){
　　　　//減去捲軸值
　　　　if (e.scrollTop) y -= e.scrollTop;
　　}
　　return y;
}

就像這樣：



相關參考資源

JavaScript大全/5E