속성 offsetTop

속성 offsetTop은 요소의 상단에서 offsetParent에 대한 오프셋을 포함합니다. offsetParent부터 요소의 테두리까지의 거리를 포함합니다.

구문

javascript요소.offsetTop;

예시

요소의 offsetParent에 대한 오프셋을 찾아봅시다:

html<div id="parent" style="position: relative;">
  <div id="elem" style="position: absolute; top: 100px;"></div>
</div>

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

코드 실행 결과:

javascript100

예시

margin 여백도 오프셋에 합산됩니다:

html<div id="parent" style="position: relative;">
  <div id="elem" style="position: absolute; top: 100px; margin: 50px;"></div>
</div>

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

코드 실행 결과:

javascript150

참고 항목