Document.elementFromPoint()

elementFromPoint() メソッドは Document オブジェクト上で利用可能で、指定した座標（ビューポートからの相対座標）における最上位の要素 (Element) を返します。

指定された点の要素が他の文書（例えば <iframe> の文書）に属する場合、その文書の親要素（<iframe> 自身）が返される。指定された点の要素が無名または XBL で生成されたコンテンツ、例えばテキストボックスのスクロールバーである場合、最初の無名ではない祖先要素（例えばテキストボックス）が返されます。

pointer-events が none に設定されている要素は無視され、その下の要素が返されます。

このメソッドが他の文書（<iframe> のサブ文書など）で実行された場合、座標はメソッドが呼び出された文書からの相対座標となります。

指定した点が文書の可視領域外にある場合や、どちらかの座標が負の値である場合、結果は null となります。

要素内の特定の位置を見つける必要がある場合は、 Document.caretPositionFromPoint() を使用してください。

elementFromPoint(x, y);

function changeColor(newColor) {
  elem = document.elementFromPoint(2, 2);
  elem.style.color = newColor;
}

<p id="para1">こちらがテキストです</p>
<button onclick="changeColor('blue');">青</button>
<button onclick="changeColor('red');">赤</button>