Thuộc tính offsetLeft của phần tử HTML DOM

Định nghĩa và cách sử dụng

offsetLeft Thuộc tính trả về vị trí bên trái tương đối với bậc cha (tính bằng pixel). Thuộc tính này là chỉ đọc.

Giá trị trả về bao gồm:

  • Vị trí bên trái và ngoại suy của phần tử
  • Mực trong cùng của bậc cha, thanh cuộn và viền

Xem thêm:Giáo trình về mô hình khung CSS

offsetParent

Tất cả các phần tử cấp block đều báo cáo vị trí di chuyển tương đối với bậc cha có vị trí di chuyển:

  • offsetTop
  • offsetLeft
  • offsetWidth
  • offsetHeight

Bậc cha có vị trí di chuyển là tổ tiên gần nhất có vị trí di chuyển không phải là tĩnh.

Nếu không tồn tại bậc cha có vị trí di chuyển, vị trí di chuyển là tương đối với văn bản chính của tài liệu.

Xem thêm:

Thuộc tính offsetTop

Thuộc tính offsetWidth

Thuộc tính offsetHeight

Thuộc tính offsetParent

Thuộc tính clientTop

Thuộc tính clientLeft

Thuộc tính clientWidth

Thuộc tính clientHeight

Mẫu

Ví dụ 1

Lấy vị trí offsetLeft của "myDIV":

const element = document.getElementById("myDIV");
let pos = element.offsetLeft;

Thử ngay

Ví dụ 2

Lấy vị trí của "myDIV":

const element = document.getElementById("myDIV");
let pos1= element.offsetTop;
let pos2= element.offsetLeft;

Thử ngay

Cú pháp

Trả về vị trí trái:

element.offsetLeft

Giá trị trả về

Loại Mô tả
Số Vị trí bên trái của phần tử, tính bằng pixel.

Hỗ trợ trình duyệt

Tất cả các trình duyệt đều hỗ trợ element.offsetTop：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Hỗ trợ Hỗ trợ Hỗ trợ Hỗ trợ Hỗ trợ Hỗ trợ