Document: elementsFromPoint() メソッド

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

elementsFromPoint()Document インターフェイスのメソッドで、指定された(ビューポートからの相対位置の)座標にあるすべての要素の配列を返します。 要素はビューポートの最上位のボックスから最下位のボックスに向けて並べられます。

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

構文

js
elementsFromPoint(x, y)

引数

x

点の水平座標です。

y

点の垂直座標です。

返値

Element オブジェクトの配列で、ビューポートの最上位のボックスから最下位のボックスに向けて並べられます。

HTML

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

JavaScript

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

結果

仕様書

Specification
CSSOM View Module
# dom-document-elementsfrompoint

ブラウザーの互換性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
elementsFromPoint

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
See implementation notes.
Requires a vendor prefix or different name for use.
Has more compatibility info.

関連情報