[jquery] jQuery : position ()과 offset ()의 차이점

Program / 글쓴이

차이점은 무엇이며 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 () 메소드는 우리 소자의 현재 위치를 검색 할 수있는 문서에 대하여 . 이것을 오프셋 parent와 관련된 현재 위치 를 검색하는 .position () 과 대조하십시오 . 전역 조작 (특히, 끌어서 놓기 구현)을 위해 기존 요소 위에 새 요소를 배치 할 경우 .offset ()이 더 유용합니다.

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

답변

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

offset ()은 문서를 기준으로 한 위치를 나타냅니다.

position ()은 부모 요소와 관련된 위치를 나타냅니다.

그러나 객체의 CSS 위치가 “절대”인 경우 두 함수 모두 너비 = 0 및 높이 = 0을 반환합니다.

답변