Получение каждого offsetParent или общего значения offSetTop и общего значения offSetLeft

Question

Я хочу получить общее значение offSetTop и общее значение offSetLeft дочернего элемента, которые имеют многоуровневый родительский элемент и могут суммироваться.

Это какой-то сокращенный способ, кроме добавления одного за другим вручную?

Answer 1

Используя jQuery: $( node ).offset() затем .top а также .left

Answer 2

Чтобы предоставить ответ без jQuery:

var a = Element, b = 0, c = 0;
while (a) {
    b += a.offsetLeft;
    c += a.offsetTop;
    a = a.offsetParent;
}

куда Element ваш узел Элемент, для которого вам нужен offsetLeft а также offsetTop,

Answer 3

https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect

Если вам нужен ограничивающий прямоугольник относительно верхнего левого угла документа, просто добавьте текущую позицию прокрутки к верхнему и левому свойствам (их можно получить с помощью window.scrollX и window.scrollY), чтобы получить ограничивающий прямоугольник, который является независимо от текущей позиции прокрутки.

      let { left, top } = domNode.getBoundingClientRect();
left += window.scrollX;
top += window.scrollY;