Método offsetParent() da iteração jQuery

Manual de referência de iteração jQuery

Exemplo

Defina a cor de fundo do elemento ascendente mais próximo do elemento li com classe item-a:

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

Experimente pessoalmente

Definição e uso

offsetParent() obtém o elemento ascendente localizado mais próximo.

Sintaxe

.offsetParent()

Explicação detalhada

Se fornecermos um objeto jQuery que representa uma coleção de elementos DOM, o método .offsetParent() nos permite procurar ascendentes no árvore DOM do elemento e construir um objeto jQuery cercado pelo elemento ascendente localizado mais próximo. O elemento localizado é aquele cuja propriedade CSS position é definida como relative, absolute ou fixed. Essa informação é útil ao calcular offset para animações de desempenho ou ao posicionar objetos na página.

Pense em uma página com lista aninhada básica, contendo elementos localizados:

<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>

Se começarmos pelo item A, podemos encontrar seus elementos ascendentes localizados:

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

Experimente pessoalmente

Isso mudará a cor de fundo do item alvo II.

Manual de referência de iteração jQuery