MozTW 討論區
https://forum.moztw.org/

請問如何抓到未定位標籤的座標呢?(已解決)
https://forum.moztw.org/viewtopic.php?f=13&t=19799		 第 1 頁 (共 1 頁)
發表人:  fanta [ 2007-07-22, 19:40 ]
文章主題 :  請問如何抓到未定位標籤的座標呢?(已解決)
假設一個<div></div>區段沒設定它的left和top，因為我不想把它定位，這樣用javascript能抓到他的座標嗎?我試過直接抓他的left和top可能因為沒設定，所以都沒值，有辦法得知他在網頁上的座標嗎?或其他類似的，我有找到offsetLeft,offsetTop，但是不知道事用法錯了還是怎樣，麻煩各位了。
發表人:  fanta [ 2007-07-22, 20:25 ]
文章主題 : 
代碼:
function func(targ)
{
   var element = targ;
   var xPos = targ.offsetLeft;
   var yPos = targ.offsetTop;
   while( targ = targ.offsetParent )
    {
        yPos += targ.offsetTop;
        xPos += targ.offsetLeft;
    }
   document.getElementById(element.id+"div").style.left = xPos;
   document.getElementById(element.id+"div").style.top = yPos;
   
}


我已經找到答案了，但是while迴圈在做什麼我就看不懂了，感覺這樣會變成無限回圈，小弟不才，知道的人麻煩解釋一下，謝謝。
發表人:  kourge [ 2007-07-26, 13:39 ]
文章主題 : 
fanta 寫:
代碼:
function func(targ)
{
   var element = targ;
   var xPos = targ.offsetLeft;
   var yPos = targ.offsetTop;
   while( targ = targ.offsetParent )
    {
        yPos += targ.offsetTop;
        xPos += targ.offsetLeft;
    }
   document.getElementById(element.id+"div").style.left = xPos;
   document.getElementById(element.id+"div").style.top = yPos;
   
}


我已經找到答案了，但是while迴圈在做什麼我就看不懂了，感覺這樣會變成無限回圈，小弟不才，知道的人麻煩解釋一下，謝謝。

他這是找累積座標的，先找目前元素的相對座標（相對，因為以母元素為參照），接著，往上一層，找母元素的相對座標，把這是些座標一個一個加起來，直到找不到母元素為止。
Prototype 這個 js lib 就有專門在處理 Position （位置）的函式，像剛剛提的，cumulativeOffset：
代碼:
  cumulativeOffset: function(element) {
    var valueT = 0, valueL = 0;
    do {
      valueT += element.offsetTop  || 0;
      valueL += element.offsetLeft || 0;
      element = element.offsetParent;
    } while (element);
    return [valueL, valueT];
  }

雖然程式碼不大一樣，用的也是類似的機制。
如果寫很多跟 DOM 或 Ajax 有關的 JS，最好用個 JS 函式庫，比較有利。
發表人:  fanta [ 2007-07-26, 23:52 ]
文章主題 : 
感謝大大的解釋，原來offset是相對位置喔，我以為是絕對位置，長了知識。
第 1 頁 (共 1 頁) 所有顯示的時間為 UTC + 8 小時
Powered by phpBB® Forum Software © phpBB Group
https://www.phpbb.com/