7

イベントには、バブリングとキャプチャの 2 つのモードがあることを理解しています。

イベントがバブルに設定されている場合、Javascript は「ドキュメント」までチェックしますか?

イベントがキャプチャに設定されている場合、Javascript は常に「ドキュメント」から開始されますか?

Javascriptはどこで停止/開始するかをどのように知っていますか?

body タグに次のコードがあるとします。

<div id='outer'>
    <div id='inner'></div>
</div>

イベントを#innerバブルに設定すると、Javascript はドキュメントをチェックしますか、それとも で停止し#outerますか?

4

3 に答える 3

5

W3Cドキュメント オブジェクト モデル イベントから

私はつまらないことを知っていますが、あなたが説明しているイベントを処理するのはjavascriptではなく、DOMエンジン(Document Object Model)です。ブラウザでは、JavaScript と DOM エンジンの間にバインディングがあり、イベントを JavaScript に伝達できますが、これは JavaScript に限定されません。たとえば、MSIE は BASIC をサポートしています。

イベントがバブルに設定されている場合、Javascript は「ドキュメント」までチェックしますか?

1.2.3「この上方伝播はドキュメントまで継続します」

「任意のイベント ハンドラーは、Event インターフェイスの stopPropagation メソッドを呼び出すことによって、それ以上のイベントの伝播を防ぐことを選択できます。いずれかの EventListener がこのメソッドを呼び出すと、現在の EventTarget のすべての追加の EventListeners がトリガーされますが、そのレベルでバブリングは停止します」

イベントがキャプチャに設定されている場合、Javascript は常に「ドキュメント」から開始されますか?

1.2.2「キャプチャは、ツリーの一番上、通常はドキュメントから操作します。」

于 2012-09-25T05:31:21.237 に答える
2

イベントバブリング

JavaScript はドキュメントまでチェックします。document にリスナーを追加し、inner にリスナーを追加すると、両方のリスナーが起動します。

イベントキャプチャ

JavaScript はドキュメントから始まり、内部までずっと続きます。document にリスナーを追加し、inner にリスナーを追加すると、両方のリスナーが起動します。


私の所見

ブラウザがある種のスマートな処理を行っていることが判明しました。

a）親階層全体をループする必要はありません

と

b) すべてのイベントをループする必要はありません。


証拠

a) 内側の div がクリックされたときに、ブラウザーが両方のクリック イベントをトリガーするのに時間がかかりません。

フィドル

b) 親階層にない他の DOM 要素に関連付けられている他の多くのイベントが存在する場合、内側の div がクリックされたときに、ブラウザーが両方のクリック イベントをトリガーするのに時間がかかりません。

フィドル

于 2012-09-25T04:44:53.093 に答える
1

部分的な答え..

1-イベントがバブルに設定されている場合、Javascriptは「ドキュメント」までチェックしますか？

階層内の要素の1つがstopPropagation（）を呼び出してバブリングを停止することを決定した場合は、そうではありません。

于 2012-09-25T05:07:08.213 に答える