DOM

DocumentOrShadowRoot.elementsFromPoint() メソッド

 編集:2022.08.30 by T.A.

[Edge]実験的。→

実験的: これは実験的な機能です。本番で使用する前にブラウザー互換性一覧表をチェックしてください。

DocumentOrShadowRoot インターフェイスのメソッドで、Document、または ShadowRoot 内の指定座標(ビューポートからの相対)にあるすべての要素の配列を返します。

これは elementFromPoint() メソッドと同じような方法で動作します。

構文
DocumentOrShadowRoot.elementsFromPoint(x, y)
xy 取得する x、y 座標。ビューポート(表示枠)の左上が基準です。
戻り値

Element オブジェクトの配列です。

HTML:

<div>
  <p>Some text</p>
</div>
<p>Elements at point 30, 20:</p>
<div id="output"></div>

JavaScript:

let output = document.getElementById("output");
if (document.elementsFromPoint) {
  let elements = document.elementsFromPoint(30, 20);
  for (var i = 0; i < elements.length; i++) {
    output.textContent += elements[i].localName;
    if (i < elements.length - 1) {
      output.textContent += " < ";
    }
  }
} else {
  output.innerHTML = "<span style=\"color: red;\">" +
     "Browser does not support <code>document.elementsFromPoint()</code>" +
     "</span>";
}

テスト