javascript - .offset().top的位移高度是相對於body還是.leftmenu_main li？ ？ ？

Question

雷雷

#

Answer 1

舉個栗子

因此offset計算的不是離距離父級的高度，而是離body的上邊距和左邊距。

Answer 2

html

    <p class="a">
        <p class="b"></p>
    </p>

css

        .a{
            position: relative;
            width: 200px;
            height: 200px;
            background-color: #f33;
            top: 200px;
        }
        .b{
            position: absolute;
            width: 100px;
            height: 100px;
            background-color: #1abc9c;
            top: 120px;
        }

js

console.log($('.b').offset().top);

offset().top是层层向上相對於body的最終結果
注意是層層向上，不管中間有幾個父級是position定位的，中間多了多少個top偏移量，都會被疊加進去。

用原生JS也可以實現：

export function getTop(obj) {
  var iTop = 0;
  while (obj != window.document.body && obj != null) {
    iTop += obj.offsetTop; //循环取每一层父元素的相对偏移量
    obj = obj.offsetParent; //设置当前元素的父元素=当前元素，用以获取再上层的offsetTop
  }
  return iTop;
}

Answer 3

那得看你寫沒寫定位父級了,如果沒有定位父級那就是body

Answer 4

為什麼不查API。

取得匹配元素集合中第一個元素相對於文檔的當前座標。