jQuery : position()과 offset() 사이의 차이

Question

position()과 offset()의 차이점은 무엇입니까? 내가 클릭 이벤트에서 다음을 수행하려고 :

console.info($(this).position(), $(this).offset()); 

그리고 그들은 정확히 반환하는 것 같은 ...

Answer 1

position 오프셋 부모에 위치 상대를 반환하고 offset 문서에 동일한 상대 않습니다. 분명히 문서가 오프셋 부모 인 경우가 종종 있는데, 이는 동일합니다. 당신은 그러나이 같은 레이아웃을 가지고있는 경우

:

<div style="position: absolute; top: 200; left: 200;"> 
    <div id="sub"></div> 
</div> 

는 그 다음 offset 하위 200있을 것입니다 : 200,하지만 position은 0입니다 : 0.

Answer 2

(클릭 된 요소는 테이블의 테이블 셀 내에) .offset() 메서드를 사용하면 문서와 관련된 요소 의 현재 위치를 검색 할 수 있습니다. 이를 오프셋 부모 인에 상대적인 현재 위치를 검색하는 .position()과 비교하십시오. 전역 조작 (특히 끌어서 놓기 구현)을 위해 기존 요소 위에 새로운 요소를 배치하면 .offset()이 더 유용합니다.

자료 :. http://api.jquery.com/offset/ 요소가있는 어떤 상황에 따라 달라

Answer 3

두 함수 모두 width가 & 높이 인 일반 개체를 반환합니다.

offset()은 문서에 상대적인 위치를 나타냅니다.

위치()는 그것의 부모 요소

에 상대적인 위치를 의미하지만, 오브젝트의 CSS 위치 될 때 "절대"두 함수 반환 & 0 = 폭 높이 = 0