DOM

：

：

HTMLElement.offsetParent プロパティ

　編集：2022.09.30 by T.A.

[Edge]。読取専用。→

element の最も近い先祖要素の <td>、<th>、<table>、もしくは <body> の参照を返します。

mdn： 要素を含む最も近くにある（包含階層で最も近い）位置指定されたオブジェクトへの参照を返します。

要素が位置指定されていない（静的位置指定の）場合、最も近い祖先である td、th、table を返し、表要素の祖先がない場合は body を返します。

注： 次の状況では、offsetParent は null を返します。

offsetParent が有用なのは、offsetTop と offsetLeft がパディング境界からの相対だからです。

構文
element.offsetParent
element HTMLElement。
値

要素オブジェクト。

例
mouseover により情報表示

HTML： 

<DIV id=IdDiv style="border:10px solid #f00">DIV要素</DIV>
<BR>
<SPAN id=IdSpan style="border:10px solid #0f0">SPAN要素</SPAN><BR>
<BR>
<TABLE id=IdTable style="border:6px solid #888; border-spacing:5px;">
 <TR><TD style="border:3px solid black; padding:10px;">
  <SPAN style="border:10px solid #0f0">SPAN要素</SPAN><BR>
</TABLE>
<BR>
<SPAN id=IdLog></SPAN>

JavaScript： 

function Job(eve){
  let E=eve.target;
  IdLog.innerHTML=E.tagName +"／offsetParent＝"+ E.offsetParent.tagName +"：offsetLeft＝"+ E.offsetLeft;
}
IdDiv.onmouseover=Job;   //イベント割り当て。
IdSpan.onmouseover=Job;  //イベント割り当て。
IdTable.onmouseover=Job; //イベント割り当て。
テスト