[解決済み] document.addEventListenerとwindow.addEventListenerの違い？

質問

PhoneGap を使用しているとき、デフォルトの JavaScript コードで document.addEventListener しかし、私は独自のコードを持っており、そのコードでは window.addEventListener :

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

何が違うのか、どちらを使うのが良いのか？

どのように解決するのですか？

その document と window は異なるオブジェクトであり、それぞれ異なるイベントを持っています。 使用方法 addEventListener() は、異なるオブジェクトのイベントをリスンします。 興味のあるイベントを実際に持っている方を使うべきでしょう。

例えば "resize" イベントが発生します。 window オブジェクトにない document オブジェクトを作成します。

例えば "readystatechange" イベントは document オブジェクトを作成します。

つまり、基本的には、どのオブジェクトが興味のあるイベントを受信するかを知り、そのイベントを受信するために .addEventListener() を、その特定のオブジェクトに適用します。

どのような種類のオブジェクトがどのような種類のイベントを発生させるかを示す興味深いチャートがあります。 https://developer.mozilla.org/en-US/docs/DOM/DOM_event_reference

伝搬イベント（クリックイベントなど）をリッスンする場合、そのイベントは document オブジェクトまたは window オブジェクトのいずれでもリッスンすることができます。 伝搬されるイベントの主な違いはタイミングだけです。 イベントは document オブジェクトの前に window オブジェクトの方が先に発生するからです。しかし、この違いは通常重要ではないので、どちらを選んでもかまいません。 一般的には、伝搬されるイベントの処理に必要な、イベントの発生源に最も近いオブジェクトを選ぶのが良いと思います。 つまり document オーバー window のどちらかを選択します。 しかし、私はしばしば、さらにソースに近づけて document.body あるいは、（可能であれば）ドキュメント内のもっと近い共通の親を使用することもできます。