jQuery: 위치()와 오프셋()의 차이

jQuery: 위치()와 오프셋()의 차이

사이의 차이점은 무엇입니까?position()그리고.offset()클릭 이벤트에서 다음을 시도했습니다.

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

그리고 그들은 정확히 똑같이 돌아오는 것 같습니다.(클릭된 요소는 표의 표 셀 안에 있습니다)

그것들이 같은지 아닌지는 상황에 따라 다릅니다.

• position를 반환합니다.{left: x, top: y}간격띄우기 상위 항목에 상대적인 개체

• offset를 반환합니다.{left: x, top: y}문서와 관련된 개체입니다.

물론 문서가 오프셋 상위 문서인 경우에는 동일합니다.간격띄우기 부모는 "포함 요소를 포함하는 가장 가까운 위치"입니다.

예를 들어, 이 문서에서는 다음과 같이 설명합니다.

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

그러면 그.$('#sub').offset()될 것이다{left: 200, top: 200}그러나 그것은.position()될 것이다{left: 0, top: 0}.

.offset() 메서드를 사용하면 문서와 관련된 요소의 현재 위치를 검색할 수 있습니다.오프셋 상위를 기준으로 현재 위치를 검색하는 .position()과 비교합니다.글로벌 조작(특히 드래그 앤 드롭 구현)을 위해 기존 요소 위에 새 요소를 배치하는 경우 .offset()이 더 유용합니다.

출처: http://api.jquery.com/offset/

두 함수 모두 너비와 높이라는 두 가지 속성을 가진 일반 개체를 반환합니다.

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

position ()는 부모 요소에 상대적인 위치를 말합니다.

그러나 객체의 CSS 위치가 "절대"이면 두 함수 모두 너비=0 & 높이=0을 반환합니다.

언급URL : https://stackoverflow.com/questions/3202008/jquery-difference-between-position-and-offset