getBoundingClientRect मेथड
getBoundingClientRect मेथड में
एलिमेंट के कोऑर्डिनेट्स का ऑब्जेक्ट होता है। कोऑर्डिनेट्स की गणना
पेज के दृश्यमान भाग के सापेक्ष की जाती है, बिना
स्क्रॉलिंग को ध्यान में रखे (विंडो के सापेक्ष)। यानी
position प्रॉपर्टी
के fixed वैल्यू की तरह।
लौटाए गए ऑब्जेक्ट में निम्नलिखित प्रॉपर्टीज़ होती हैं: left,
top, right, bottom, width, height।
यह ध्यान देने योग्य है कि इन प्रॉपर्टीज़ का CSS प्रॉपर्टीज़ से कोई
संबंध नहीं है। इनमें एलिमेंट की संबंधित भुजाओं तक की
दूरी होती है।
left/right के लिए - पेज के दृश्यमान क्षेत्र की बाईं सीमा
से, और top/bottom के लिए - ऊपरी सीमा से।
सिंटैक्स
element.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मेथड,
जो कोऑर्डिनेट्स के आधार पर एलिमेंट लौटाता है