เมธอด 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,
ซึ่งส่งคืนองค์ประกอบตามพิกัด