Touch: target プロパティ

targetTouch インターフェイスの読み取り専用プロパティで、タッチ点がその要素の操作領域外に移動した場合や、文書から取り除かれた場合でも、タッチ点が最初に配置されたときに接触が開始された (EventTarget) を返します。対象要素が文書から除去されても、イベントはその要素を対象とし、ウィンドウや文書にバブルアップされるとは限らないことに注意してください。タッチしている間に要素が除去されるおそれがある場合は、タッチリスナーを対象に直接取り付けるのが最善の手法です。

Touch オブジェクトが適用される EventTarget

この例では、Touch オブジェクトの Touch.target プロパティにアクセスする方法を示します。 Touch.target プロパティは Element (EventTarget) であり、表面に最初に連絡先が配置されたときにこの点を開始します。

以下の単純なコードでは、ユーザーが source 要素に 1 つ以上の接触を開始することを想定しています。この要素の touchstart イベントハンドラーが呼び出されると、各タッチ点の Touch.target プロパティは、イベントの TouchEvent.targetTouches リスト経由でアクセスします。

js
// touchmove リスナーを 'source' 要素に登録
const src = document.getElementById("source");

src.addEventListener(
  "touchstart",
  (e) => {
    // この要素で有効化されたタッチ点を反復処理
    for (let i = 0; i < e.targetTouches.length; i++) {
      console.log(`touchpoint[${i}].target = ${e.targetTouches[i].target}`);
    }
  },
  false,
);

仕様書

Specification
Touch Events
# dom-touch-target

ブラウザーの互換性

BCD tables only load in the browser