Метод getBoundingClientRect() в HTML DOM

Объект элемента HTML DOM

getBoundingClientRect()Метод возвращает размер элемента и его положение относительно viewport (видимой области)

Возвращаемое значение - это объект DOMRect с восемью свойствами: left, top, right, bottom, x, y, width, height。

Примечание:При расчете границ矩形 следует учитывать объем прокрутки области просмотра. Это означает, что каждый раз, когда发生变化 положение прокрутки, края (верх, левая, нижняя и правая) изменяют свои значения.

Грамматика:

element.getBoundingClientRect()

var div = document.getElementById("myDiv");
var rect = div.getBoundingClientRect();

Совместимость браузеров

Метод getBoundingClientRect() полностью поддерживается всеми браузерами:

Технические детали

Объект элемента HTML DOM