Методи getBoundingClientRect

Методи getBoundingClientRect дорои объекти координатҳои унсур мебошад. Координатҳо нисбат ба қисми дидашавандаи саҳифа бо назардошти ғалталаккунӣ ҳисоб карда мешаванд (нисбат ба равзана). Яъне ҳамон гуна ки дар хосияти position дар қимати fixed.

Дар объекти баргардонидашуда хосиятҳои зерин ҷойгиранд: left, top, right, bottom, width, height. Бояд қайд кард, ки ин хосиятҳо ҳеҷ работе бо хосиятҳои CSS надоранд. Дар онҳо масофаҳо то тарафҳои мувофиқи унсур ҷойгиранд. Барои left/right - аз сарҳади чапи қисми дидашавандаи саҳифа, ва барои top/bottom - аз болоӣ.

Синтаксис

унсур.getBoundingClientRect();

Намуна

Координатҳои унсурро мегирем:

<div id="elem"></div>

#elem {
	width: 100px;
	height: 100px;
	border: 1px solid black;
}

let elem = document.querySelector('#elem');
console.log(elem.getBoundingClientRect());

Ҳамчунин нигаред

хосияти offsetParent,
ки дорои волидайн бо ҷойгиршавӣ мебошад
хосияти offsetTop,
ки дорои ҷойивазкунии унсур аз боло мебошад
хосияти offsetLeft,
ки дорои ҷойивазкунии унсур аз чап мебошад
методи elementFromPoint,
ки унсурро бар асоси координатҳо бармегардонад