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 の背景色が変更されます。