DOM

：

：

EventTarget.dispatchEvent メソッド

　編集：2022.09.19 by T.A.

→

EventTarget で指定のイベント起動させます。

mdn： Event をそのオブジェクトへ送り、関連する EventListener を（同期的に）適切に起動させます。

通常のイベント処理ルール（キャプチャとオプションのバブリング フェーズを含む）は dispatchEvent() で手動で配信されたイベントにも適用されます。

dispatchEvent() の呼び出しは、イベントを発行させるための最後のステップです。イベントは既に Event() コンストラクターを使って作成され、初期化されているはずです。（¶eventは Event オブジェクトで初期化する必要がある）

Note： このメソッドを呼び出すとき、Event.target プロパティは現在の EventTarget に初期化されます。

「ネイティブ」イベントがブラウザーによって発生し、イベント ループを介して非同期にイベント ハンドラーを呼び出すのとは異なり、dispatchEvent() はイベント ハンドラーを同期的に呼び出します。適用可能なすべてのイベント ハンドラーが呼び出され、dispatchEvent() から戻る前に返されます。

※ ディスパッチ： 複数のプログラムを実行中のマルチタスク オペレーティング システムにおいて、プログラムに実行権を渡すこと。／net

構文
EventTarget.dispatchEvent(event)
EventTarget イベントを起こしたいターゲット EventTarget。→addEventListener()

mdn： Event.target を初期化し、どのイベント リスナーを呼び出すかを決定するのに使われます。

event 起こしたいイベントで初期化された Event オブジェクト。

mdn： 配信する Event オブジェクトです。この Event.target プロパティは現在の EventTarget に設定されます。

戻り値

Boolean。event がキャンセル可能で、かつ event を受け取ったイベント ハンドラーの少なくとも 1 つが Event.preventDefault()（ユーザー エージェントに通常どおりにこのイベント行うべきではない事を伝える）によりを呼び出した場合は false となります。それ以外の場合は true です。

例外
InvalidStateError ／DomException
イベントの初期化時に、イベントの種類が指定されなかった場合に発生します。

警告： イベント ハンドラーで発生した例外は、捕捉されない例外として報告されます。イベント ハンドラーはネストされたコール スタック上で実行されます。イベント ハンドラーが完了するまで呼び出し元はブロックされますが、例外は呼び出し元まで伝搬しません。

例

→。

昔ながらのやり方

イベントを作成する古いアプローチでは、Java に触発された API を使用します。次に、document.createEvent() を使用した例を示します。 

const event = document.createEvent('Event');
event.initEvent('build', true, true); //イベント名が「build」であることを定義します。
elem.addEventListener('build', (e) => { //イベントを組み込む。e は Event オブジェクトが入ります。
  //処理
}, false);
elem.dispatchEvent(event); //target は任意の Element または他の EventTarget にすることができます。

HTML： 

<SPAN id=IdSpan>SPAN要素。ここをクリック</SPAN>

JavaScript： 

function Job(eve){  //イベント発生時の処理：
  let Y=eve.target; //イベント発生した要素オブジェクトの取得。
  alert(eve.type +"："+ Y.tagName); //表示：イベントのタイプと発生した要素名。
}
IdSpan.addEventListener("click", Job); //イベント組み込み。

↑を実行して、SPAN要素でクリックしてみると、

以下のように表示されます。 

click：SPAN

↓を実行してみます。 

Eve=document.createEvent('Event');  //イベント生成。
Eve.initEvent('click', true, true); //clickイベントで初期化。
IdSpan.dispatchEvent(Eve);          //clickイベント起動。

すると、先ほどと同じように以下のように表示されます。つまりイベントが起動する？。 

click：SPAN
関連

Event.isTrusted プロパティ。

テスト