offsetParent 알고리즘 분석_기본 지식

A 요소의 offsetParent 속성을 호출할 때 다음 알고리즘에 따라 해당 요소를 반환해야 합니다.

다음 조건 중 하나라도 해당되면 null을 반환하고 알고리즘을 중지합니다.
A는 루트 요소입니다.
A는 HTML 본문 요소입니다.
요소 A의 위치 속성의 계산된 값은 고정되어 있습니다. 참고 1
A가 HTML 요소 영역이고 상위 요소 체인에 HTML 요소 맵이 있는 경우 상위 요소 체인에서 A에 가장 가까운 HTML 요소 맵을 반환하고 이 알고리즘을 중지합니다. 참고 2
다음 조건 중 하나라도 true이면 다음 조건을 만족하는 A에 가장 가까운 상위 요소를 반환하고 이 알고리즘을 중지합니다.
상위 요소의 위치 속성의 계산된 값은 정적이지 않습니다. 참고 3
상위 요소는 HTML body 요소입니다. 참고 4
A의 위치 속성의 계산된 값은 정적이며 상위 요소는 td, th 또는 table입니다.
널을 반환합니다.
앞서 언급한 바와 같이 위의 내용은 작업 초안이므로 반드시 현재 브라우저와 일치하지는 않습니다.

참고 1 Firefox는 해당되지 않습니다. 적용 가능, DOCTYPE으로 인해 IE 7이 적용되지 않습니다. 고정이 지원되는 경우(이하 IE 6 모드라고 함) 적용되지 않습니다.
참고 2 Firefox에서는 사용할 수 없습니다.
참고 3 상위 요소의 위치 속성의 계산된 값은 고정되어 있으며 IE 6 또는 IE 6 모드에서는 적용되지 않습니다.
참고 4 IE 7 모드에서는 요소 위치 속성의 계산된 값이 절대값 또는 상대값인 경우 BODY 대신 요소 HTML이 반환됩니다.
요약

브라우저마다, 브라우저 버전마다, 동일 버전의 모드마다 offsetParent를 구하는 알고리즘이 서로 다른 것을 볼 수 있는데, 이는 정말 번거로운 일입니다. 따라서 offsetParent 루프와 offsetLeft 및 offsetTop을 통해 브라우저에서 컨트롤의 절대 위치를 얻는 것으로 이해하는 것이 좋습니다.

다행히도 다양한 브라우저에는 동일한 offsetParent를 사용하는 공통 레이아웃이 있습니다. 즉, 외부 요소 div의 계산된 위치 값이 상대적이거나 절대적인 경우 내부 요소 div의 offsetParent는 항상 외부 요소입니다. 요소 div.