AddEventListenerの使用例

（divはJSの前に配置する必要があることに注意する必要があります）

一般的に言えば、DOMオブジェクトが同じイベントにバインドされている場合、最後のイベントのみが有効になります。たとえば、次のようになります。

コードコピーは次のとおりです。

document.getElementById（ "btn"）。onclick = method1;

document.getElementById（ "btn"）。onclick = method2;

document.getElementById（ "btn"）。onclick = method3;

次に、Method3のみが有効になります。

Mozillaシリーズの場合は、AddEventListenerを使用して、次のような順番に複数のイベントを実装できるようにします。

コードコピーは次のとおりです。

var btn1obj = document.getElementById（ "btn1"）;

//ELEMENT.ADDEVENTLISTENER(Type、リスナー、UseCapture）;

btn1obj.addeventlistener（ "click"、method1、false）;

btn1obj.addeventlistener（ "click"、method2、false）;

btn1obj.addeventlistener（ "click"、method3、false）;

実行順序はmethod1-> method2-> method3です

IEシリーズの場合、AttachEventは次のような順番に複数のイベントを実装できます。

コードコピーは次のとおりです。

var btn1obj = document.getElementById（ "btn1"）;

//object.attachevent（event,function）;

btn1obj.attachevent（ "onclick"、method1）;

btn1obj.attachevent（ "onclick"、method2）;

btn1obj.attachevent（ "onclick"、method3）;

実行順序は方法3-> method2-> method1です

======================================================================================================

モジラで：

AddEventListenerの使用方法

Target.AddeventListener（タイプ、リスナー、UseCapture）;

ターゲット：ドキュメントノード、ドキュメント、ウィンドウ、またはxmlhttprequest。

タイプ：文字列、イベント名には、「クリック」、「マウスオーバー」、「キーダウン」など、「オン」が含まれていません。

リスナー：JavaScriptのEventListenerインターフェイスまたは関数を実装します。

usecapture：キャプチャを使用するかどうか、通常はfalseを使用します。例：document.getElementById（ "testText"）。AddEventListener（ "keydown"、function（event）{alert（event.keycode）;}、false）;

IEで：

Target.Attachevent（タイプ、リスナー）;

ターゲット：ドキュメントノード、ドキュメント、ウィンドウ、またはxmlhttprequest。

タイプ：文字列、イベント名、「onclick」、「onmouseover」、「onkeydown」などの「on」を含む。

リスナー：JavaScriptのEventListenerインターフェイスまたは関数を実装します。例：document.getElementById（ "txt"）。attachevent（ "onclick"、function（event）{alert（event.keycode）;}）;

W3CおよびIEは、指定されたイベントの削除もサポートしています。目的は、セットイベントを削除することです。フォーマットは次のとおりです。

removeEventListener（イベント、関数、キャプチャ/バブル）;

Windows IEの形式は次のとおりです。

Detachevent（イベント、機能）;

Dom2 Evolution：

新しいDOM2の使用は、addeventlistener（）関数によって観察できます。

コードコピーは次のとおりです。

AddEventListener（イベント、関数、キャプチャ/バブル）;

パラメーターイベントは上の表に示されています。機能は実行される関数です。キャプチャとバブルは、W3Cによって処方された2つのタイムモードです。簡単に言えば、Captureはドキュメントの最初から最後の行を読み取り、イベントを実行することです。バブルは最初に指定された場所を見つけてから、イベントを実行します。

キャプチャ/バブルのパラメーターは、ブール値、キャプチャを使用するための真の手段、およびバブルの偽手段です。 Windows Internet Explorerは、次のような形式を使用して、abactedEvent（）であるイベントハンドラーも策定しました。

コードコピーは次のとおりです。

window.attachevent（ "submit"、myfunction（））;

さらに特別なのは、Windows IE環境ではバブルモードが使用されているため、ActitionEventがキャプチャ/バブルパラメーターを指定する必要がないことです。

どのリスニングタイプがサポートされているかを判断する方法は？のように：

コードコピーは次のとおりです。

if（typeof window.addeventlistener！=“ undefined”）{

window.addeventlistener（ "load"、lollover、false）;

} それ以外 {

window.attachevent（ "onload"、lollover）

}

上記のtypeof windof.addeventlistener！= "未定義"プログラムコードは、ユーザーのブラウザがAddEventListenerイベントモデルをサポートするかどうかを判断できます。サポートされていない場合は、AttachEventが使用されます。

W3CおよびIEは、指定されたイベントの削除もサポートしています。目的は、セットイベントを削除することです。フォーマットは次のとおりです。

W3C形式：

removeEventListener（イベント、関数、キャプチャ/バブル）;

Windows IEの形式は次のとおりです。

Detachevent（イベント、機能）;