HTML の click() メソッドが同期的に実行されるのはなぜですか?

Question

MDN では、dispatchEvent() を導入するときに dispatchEvent() が同期的に実行されると述べていることがわかりましたが、HTML click()## について言及している MDN や HTML Standard のような公式ドキュメントは見つかりませんでした。 # メソッド 同期的に実行するか、合成イベントを同期的に実行します。誰かが関連ファイルを私と共有できますか? 本当に感謝しています！

それとも、直接の結論ではなく、ドキュメント内に実行手順の説明が含まれている可能性がありますか?

dispatchEvent() と click() の両方が isTrusted プロパティを false に設定することに気付きましたが、eventListener 呼び出しが正しいかどうかはわかりません。時間は次第です。

Answer 1

各アルゴリズム ステップには、「並列」、「キュー タスク」、またはこれらにリンクされている仕様内の何かが同期的に実行されるとは記載されていません。 *

仕様アルゴリズムの内容dispatchターゲット イベントは常に同期的に実行されます。これは、EventTarget#dispatchEvent()、HTMLElement#click()、または実際のユーザーが開始したイベントから取得されます。

混乱を招くことに、 ほとんどの ケースでは、この イベントのスケジュール アルゴリズム自体が タスクのキューイング 呼び出しにラップされているため、実際にはイベントの発生は非同期になります。

たとえば、 画像が読み込まれると、 となります。

ここで、

"Queue Element Task" は Queue Task アルゴリズムを呼び出し、 "Trigger Event" は > スケジューリング アルゴリズム を呼び出します。

つまり、この場合、画像の読み込みが実際に行われた後に、

load イベントが非同期的に発生します。

---

ここで、

EventTarget#dispatchEvent() (および HTMLElement#click( ) に戻ると、次のようになります。多くのイベントに同じビルド ステップが適用されます)、新しいタスクをキューに入れることなく、実際に dispatch アルゴリズムを直接呼び出していることがわかります。

アルゴリズムを同期的に呼び出すだけでなく、アルゴリズムの結果を呼び出し元に返します。したがって、アルゴリズムは並列処理できず、呼び出し元は結果を取得するためにすべてのハンドラーを同期的に呼び出す必要があります。

const makeEvent = (type) => new Event(type, { cancelable: true }); addEventListener("foo", (evt) => { console.log("foo が発射されました"); }); console.log("戻り値",dispatchEvent(makeEvent("foo"))); addEventListener("bar", (evt) => { console.log("バーが発射されました"); evt.preventDefault(); // イベントをキャンセルします }); console.log("戻り値",dispatchEvent(makeEvent("bar")));

#*もしかしたら他にも事例があるかもしれませんが、私はそれについて知りません。もし存在するなら、きっと十分明らかでしょう。