getBoundingClientRect

 

getBoundingClientRect는 요소의 크기와 뷰포트를 기준으로 한 위치값을 객체로 반환합니다.

 

let elem = document.querySelector('div');
let rect = elem.getBoundingClientRect();

for(var key in rect) {
	if( typeof rect[key] !== 'function' ){
  		let para = document.createElement('p');
    		para.textContent = `${key} : ${rect[key]}`;
    		document.body.appendChild(para)
	}
}

 

References

https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect