[JS] getBoundingClientRect

I'm Your Cho-i·2022년 11월 17일
0

JS

목록 보기
4/4

📌 getBoundingClientRect()

element.getBoundingClientRect()

현재 브라우저 화면을 기준으로 위치 값을 가져옴

element의 크기(width, height)와 뷰포트(viewport)를 기준으로 한 위치(left, top, right, bottom, x, y) 이렇게 총 8가지 속성이 있는 DOMRect 객체를 리턴.

width, height는 contents뿐 아니라 padding과 border까지 포함.

const target = document.querySelector('.target');

console.log(target.getBoundingClientRect());

/*
DOMRect {
  x,
  y,
  width,
  height,
  top,
  bottom,
  left,
  right    
}
*/
profile
https://github.com/Cho-i

0개의 댓글