jQuery 순회 - offsetParent() 메서드

예제

item-a 클래스 이름을 가진 li 요소의 가장 가까운 정의된 정위존소의 배경색을 설정합니다:

$('li.item-a').offsetParent().css('background-color', 'red');

직접 시험해 보세요

정의와 사용법

offsetParent()는 정의된 가장 가까운 조상 요소를 얻습니다.

문법

.offsetParent();

상세 설명

DOM 요소 집합을 나타내는 jQuery 객체가 주어지면, .offsetParent() 메서드는 DOM 트리에서 요소의 조상을 검색하고, 가장 가까운 정의된 조상 요소로 둘러싸인 jQuery 객체를 생성합니다. 정의된 요소는, 요소의 CSS position 속성이 relative, absolute 또는 fixed로 설정된 경우를 의미합니다. 이 정보는 애니메이션 계산에서 사용되거나 페이지에서 요소를 배치할 때 유용합니다.

정의된 내포된 목록의 페이지를 생각해 보세요, 그 중에 정의된 요소가 있습니다:

<ul class="level-1">
  <li class="item-i">I</li>
  <li class="item-ii" style="position: relative;">II
    <ul class="level-2">
      <li class="item-a">A</li>
      <li class="item-b">B
        <ul class="level-3">
          <li class="item-1">1</li>
          <li class="item-2">2</li>
          <li class="item-3">3</li>
        </ul>
      </li>
      <li class="item-c">C</li>
    </ul>
  </li>
  <li class="item-iii">III</li>
</ul>

프로젝트 A에서 시작하면, 그의 정의된 조상 요소를 찾을 수 있습니다:

$('li.item-a');.offsetParent();.css('background-color', 'red');

직접 시험해 보세요

이는 정의된 프로젝트 II의 배경색을 변경합니다.