offsetLeft와 style.left의 차이점

여름 · 게시됨 2019. 2. 18. 오후 2:05:39

offsetLeft는 부모 객체에 대한 왼쪽 여백을 얻습니다

왼쪽은 위치 특성(위치은 상대형으로 정의됨)으로 부모 객체에 대해 왼쪽 여백을 얻거나 설정합니다.

만약 부모 div의 위치가 다음과 같이 정의된다면:
상대: 절대 위치 원소를 생성한다

로그인이 보이네요.

, 부분 분정의 위치는 다음과 같이 정의된다.
절대적:상대적 위치 원소 생성
, 자식 div의 style.left의 값은 부모 div의 값에 상대적입니다.

로그인이 보이네요.

이것은 offsetLeft와 동일하지만, 다음과 같습니다:
1. style.left는 28px와 같은 문자열을 반환하고, offsetLeft는 값을 28로 반환하며, 얻은 값을 계산해야 한다면
offsetLeft를 사용하는 것도 더 편리합니다.
2. style.left는 읽기-쓰기이고, offsetLeft는 읽기 전용이므로 div의 위치를 바꾸려면 style.left만 수정할 수 있습니다.
3. style.left의 값은 사전에 정의되어야 하며, 그렇지 않으면 얻어진 값이 비어 있습니다. 그리고 html로 정의되어야 한다는 실험을 해봤는데, 만약 정의된다면
CSS에서는 style.left 값이 여전히 비어 있는데, 제가 처음에 겪었던 문제입니다. 그리고 항상 style.left의 값을 얻을 수 없습니다.

offsetLeft는 div 위치를 미리 정의하지 않고도 여전히 가져올 수 있습니다.

[JavaScript] offsetLeft와 style.left의 차이점

본 섹션