Thuộc tính offsetTop

Thuộc tính offsetTop chứa độ lệch của phần tử từ phía trên so với offsetParent. Nó chứa khoảng cách từ offsetParent đến đường viền của phần tử.

Cú pháp

javascriptphần_tử.offsetTop;

Ví dụ

Hãy tìm độ lệch của phần tử so với offsetParent của nó:

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);

Kết quả thực thi mã:

javascript100

Ví dụ

Khoảng cách margin cũng được cộng vào độ lệch:

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);

Kết quả thực thi mã:

javascript150

Xem thêm

  • thuộc tính offsetLeft,
    chứa độ lệch của phần tử từ bên trái
  • phương thức getBoundingClientRect,
    tìm độ lệch của phần tử