184

PhoneGapを使用している間、を使用するデフォルトのJavaScriptコードがいくつかありますdocument.addEventListenerが、私は以下を使用する独自のコードを持っていますwindow.addEventListener：

function onBodyLoad(){
    document.addEventListener("deviceready", onDeviceReady, false);
    document.addEventListener("touchmove", preventBehavior, false);
    window.addEventListener('shake', shakeEventDidOccur, false);
}

違いは何ですか？どちらを使用するのが良いですか？

4

4 に答える 4

219

documentとは異なるオブジェクトであり、windowいくつかの異なるイベントがあります。それらを使用addEventListener()すると、別のオブジェクト宛てのイベントをリッスンします。興味のあるイベントが実際にあるものを使用する必要があります。

たとえば、オブジェクト上にない"resize"イベントがオブジェクト上にあります。windowdocument

たとえば、"readystatechange"イベントはdocumentオブジェクト上でのみ発生します。

.addEventListener()したがって、基本的には、どのオブジェクトが関心のあるイベントを受け取り、その特定のオブジェクトで使用するかを知る必要があります。

これは、どのタイプのオブジェクトがどのタイプのイベントを作成するかを示す興味深いチャートです：https ://developer.mozilla.org/en-US/docs/DOM/DOM_event_reference

伝播されたイベント（クリックイベントなど）をリッスンしている場合は、ドキュメントオブジェクトまたはウィンドウオブジェクトのいずれかでそのイベントをリッスンできます。伝播されるイベントの唯一の主な違いは、タイミングです。イベントは階層の最初に発生するため、オブジェクトのdocument前にオブジェクトにヒットしますwindowが、その違いは通常重要ではないため、どちらかを選択できます。一般に、伝播されたイベントを処理するときに、ニーズを満たすイベントのソースに最も近いオブジェクトを選択する方が適切だと思います。それはあなたがどちらかがうまくいくときを選ぶことを示唆するでしょdocumentうwindow。しかし、私はしばしばソースにさらに近づきdocument.body、ドキュメント内のより近い共通の親を使用します（可能な場合）。

于 2012-08-20T21:31:47.603 に答える
5

javascriptには、通常、同じことをしたり、同じ情報を見つけたりするためのさまざまな方法があります。あなたの例では、常に存在することが保証されている要素を探しています。window両方ともdocument法案に適合します（わずかな違いがあります）。

mozilla開発ネットワークから：

addEventListener（）は、単一のターゲットに単一のイベントリスナーを登録します。イベントターゲットは、ドキュメント内の単一の要素、ドキュメント自体、ウィンドウ、またはXMLHttpRequestの場合があります。

常にそこにある「ターゲット」を信頼できる限り、唯一の違いは、聞いているイベントです。お気に入りを使用してください。

于 2012-08-20T21:34:25.320 に答える
3

windowバインディングは、ブラウザによって提供される組み込みオブジェクトを参照します。を含むブラウザウィンドウを表しますdocument。そのaddEventListenerメソッドを呼び出すと、最初の引数で記述されたイベントが発生するたびに呼び出される2番目の引数（コールバック関数）が登録されます。

<p>Some paragraph.</p>
<script>
  window.addEventListener("click", () => {
    console.log("Test");
  });
</script>

addEventListnersにウィンドウまたはドキュメントを選択する前に、次の点に注意する必要があります

  1. ほとんどのイベントは、windowまたはdocumentのような一部のイベントと同じですが、、、および にresize関連する他のイベントはすべてウィンドウに設定する必要があります。loadingunloadingopening/closing
  2. ウィンドウにはドキュメントがあるため、イベントが最初にドキュメントにヒットするため、ドキュメントを使用して処理することをお勧めします（処理できる場合）。
  3. Internet Explorerは、ウィンドウに登録されている多くのイベントに応答しないため、イベントの登録にはドキュメントを使用する必要があります。
于 2019-12-17T09:16:50.523 に答える
0

私の意見では、伝播されたイベントを処理するときは、一般的に、ニーズを満たすイベントのソースに最も近いオブジェクトを選択する方が適切です。

したがって、イベントを要素に発生させたい場合は、window.addEventListener()（ウィンドウ変数が要素であると想定して）使用することをお勧めします。イベントをリッスンするときにここで最も重要なことは、コードとイベントの実行がより高速に動作することです。唯一のことです。この場合、それは重要です。

于 2021-09-21T19:15:31.313 に答える