Javascript の addEventListener() とattachEvent()_javascript スキルの違いの分析
javascript
Mozilla の場合:
addEventListener の使用方法:
target.addEventListener(type, listenr, useCapture);
target: document ノード, document,ウィンドウまたは XMLHttpRequest。
type: 文字列、イベント名。「クリック」、「マウスオーバー」、「キーダウン」などの「on」を除く。
リスナー: EventListener インターフェイスまたは JavaScript の関数を実装します。
useCapture: キャプチャを使用するかどうか。通常は false。例: document.getElementById("testText").addEventListener("keydown", function (event) {alert(event.keyCode); }, false);
IE の場合:
target.attachEvent(type,listener);
ターゲット: ドキュメント ノード、ドキュメント、ウィンドウ、または XMLHttpRequest。
type: 文字列、「onclick」、「onmouseover」、「onkeydown」などの「on」を含むイベント名。
リスナー: EventListener インターフェイスまたは JavaScript の関数を実装します。 例: document.getElementById("txt").attachEvent("onclick",function(event){alert(event.keyCode);});
W3C と IE は両方とも、指定されたイベントの削除をサポートしています。設定を削除するイベントです。形式は次のとおりです。
W3C 形式:
removeEventListener(event, function, capture/bubble); > Windows IE の形式は次のとおりです:
detachEvent(event, function);
target.addEventListener(type,listener, useCapture);
ターゲット ドキュメント ノード,ドキュメント、ウィンドウ、または XMLHttpRequest。
「クリック」、「マウスオーバー」、「キーダウン」などの「on」を除く文字列、イベント名を入力します。
リスナーは、EventListener インターフェイスまたは JavaScript の関数を実装します。
useCapture キャプチャを使用するかどうかは、後でイベント フローのセクションを読むとわかります。通常は false を使用します。
イベントがトリガーされると、次のような Event オブジェクトがイベント ハンドラーに渡されます。 document.getElementById ("testText").addEventListener("keydown", function (event) {alert(event.keyCode); }, false);
対応しているブラウザのバージョンが異なるため、ご利用の際はご注意ください
attachEvent メソッド ボタン onclick
addEventListener メソッド ボタン click IE で使用
Fox で使用 両方を使用する原則: 実行の優先順位は異なる場合があります。 以下の例を次のように説明します。
attachEvent メソッド、for特定のイベント 他の処理イベントをアタッチします。 (Mozilla シリーズはサポートされていません)
Mozilla シリーズでは addEventListener メソッドが使用されます
例: document.getElementById("btn").onclick = method1;
document.getElementById("btn").onclick =
document.getElementById("btn").onclick = method3; このように記述すると、medhot3 のみが実行されます。
var btn1Obj = document.getElementById("btn1") ; //オブジェクト .attachEvent(event,function);
btn1Obj.attachEvent("onclick",method2); ,method3); 実行順序は、method3->method2->method1
Mozilla シリーズの場合、このメソッドはサポートされていないため、addEventListener var btn1Obj = document.getElementById("btn1") を使用する必要があります。 ;
//element.addEventListener (type,listener,useCapture);
btn1Obj.addEventListener("click",method1,false); 🎜>btn1Obj.addEventListener("click" , method3, false); 実行順序は、method1->method2->method3 です
例: (div は js の前に配置する必要があることに注意してください)
コードをコピーします
コードは次のとおりです。
addEventListener の使用方法:
target.addEventListener(type, listenr, useCapture);
target: document ノード, document,ウィンドウまたは XMLHttpRequest。
type: 文字列、イベント名。「クリック」、「マウスオーバー」、「キーダウン」などの「on」を除く。
リスナー: EventListener インターフェイスまたは JavaScript の関数を実装します。
useCapture: キャプチャを使用するかどうか。通常は false。例: document.getElementById("testText").addEventListener("keydown", function (event) {alert(event.keyCode); }, false);
IE の場合:
target.attachEvent(type,listener);
ターゲット: ドキュメント ノード、ドキュメント、ウィンドウ、または XMLHttpRequest。
type: 文字列、「onclick」、「onmouseover」、「onkeydown」などの「on」を含むイベント名。
リスナー: EventListener インターフェイスまたは JavaScript の関数を実装します。 例: document.getElementById("txt").attachEvent("onclick",function(event){alert(event.keyCode);});
W3C と IE は両方とも、指定されたイベントの削除をサポートしています。設定を削除するイベントです。形式は次のとおりです。
W3C 形式:
removeEventListener(event, function, capture/bubble); > Windows IE の形式は次のとおりです:
detachEvent(event, function);
target.addEventListener(type,listener, useCapture);
ターゲット ドキュメント ノード,ドキュメント、ウィンドウ、または XMLHttpRequest。
「クリック」、「マウスオーバー」、「キーダウン」などの「on」を除く文字列、イベント名を入力します。
リスナーは、EventListener インターフェイスまたは JavaScript の関数を実装します。
useCapture キャプチャを使用するかどうかは、後でイベント フローのセクションを読むとわかります。通常は false を使用します。
イベントがトリガーされると、次のような Event オブジェクトがイベント ハンドラーに渡されます。 document.getElementById ("testText").addEventListener("keydown", function (event) {alert(event.keyCode); }, false);
対応しているブラウザのバージョンが異なるため、ご利用の際はご注意ください
attachEvent メソッド ボタン onclick
addEventListener メソッド ボタン click IE で使用
Fox で使用 両方を使用する原則: 実行の優先順位は異なる場合があります。 以下の例を次のように説明します。
attachEvent メソッド、for特定のイベント 他の処理イベントをアタッチします。 (Mozilla シリーズはサポートされていません)
Mozilla シリーズでは addEventListener メソッドが使用されます
例: document.getElementById("btn").onclick = method1;
document.getElementById("btn").onclick =
document.getElementById("btn").onclick = method3; このように記述すると、medhot3 のみが実行されます。
var btn1Obj = document.getElementById("btn1") ; //オブジェクト .attachEvent(event,function);
btn1Obj.attachEvent("onclick",method2); ,method3); 実行順序は、method3->method2->method1
Mozilla シリーズの場合、このメソッドはサポートされていないため、addEventListener var btn1Obj = document.getElementById("btn1") を使用する必要があります。 ;
//element.addEventListener (type,listener,useCapture);
btn1Obj.addEventListener("click",method1,false); 🎜>btn1Obj.addEventListener("click" , method3, false); 実行順序は、method1->method2->method3 です
例: (div は js の前に配置する必要があることに注意してください)
コードをコピーします
コードは次のとおりです。
; >
クリック