เมธอด getBoundingClientRect

เมธอด getBoundingClientRect มี วัตถุพิกัดขององค์ประกอบ พิกัดจะถูกคำนวณ สัมพันธ์กับส่วนที่มองเห็นได้ของหน้าเว็บโดยไม่ คำนึงถึงการเลื่อน (สัมพันธ์กับหน้าต่าง) นั่นคือ เหมือนกับคุณสมบัติ position ในค่า fixed

ในวัตถุที่ส่งคืนจะมีคุณสมบัติ: left, top, right, bottom, width, height ควรสังเกตว่าคุณสมบัติเหล่านี้ไม่มีอะไร เกี่ยวข้องกับคุณสมบัติ CSS ในคุณสมบัติเหล่านี้มี ระยะห่างไปยังด้านที่สอดคล้องกันขององค์ประกอบ สำหรับ left/right - จากขอบซ้ายของพื้นที่ที่มองเห็นได้ ของหน้าเว็บ และสำหรับ top/bottom - จากขอบบน

ไวยากรณ์

javascriptองค์ประกอบ.getBoundingClientRect();

ตัวอย่าง

รับพิกัดขององค์ประกอบ:

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

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

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

ดูเพิ่มเติม