単純なことを要約しましょう
注:次の方法はeventUtilオブジェクトに包まれており、オブジェクトリテラル定義方法が直接使用されます。 。 。
adddイベント方法
addhandler:function(element、type、handler){if(element.addeventlistener){//検出それがdom2レベルのメソッドelement.addeventlistener(タイプ、ハンドラー、false); } else if(element.attachevent){// IEレベルのメソッドelement.attachevent( "on" + type、handler)であるかどうかを検出します。 } else {//検出それがdom0レベルのメソッド要素であるかどうか["on" + type] = handler; }}以前に追加されたイベントメソッドを削除します
remaidhandler:function(element、type、handler){if(element.removeeventlistener){element.removeeventlistener(type、handler、false); } else if(element.detachevent){element.detachevent( "on" + type、handler); } else {element ["on" + type] = null; }}eventイベントおよびイベントオブジェクトのターゲットを取得します
// getEventで記述されたイベントオブジェクトの互換性を取得:function(event){return event?イベント:window.event; }、// getTarget:function(event)で記述されたイベントオブジェクトターゲットの互換性を取得{return event.target || event.srcelement; }compareブラウザのデフォルトイベントをブロックするための書き込み
PreventDefault:function(event){if(event.preventdefault){event.preventdefault(); } else {event.returnValue = false; }}イベントが泡立つのを防ぐための執筆
stoppropagation:function(event){if(event.stoppropagation){event.stoppropagation(); } else {event.cancelbubble = true; }}mouseverとマウスアウトイベントにのみ含まれる関連要素を取得する方法
//マウスオーバーおよびマウスアウトイベントに含まれる関連要素を取得する方法getRelatedTarget:function(event){if(event.relatedTarget){return event.relatedTarget; } else if(event.toelement){return event.toelement; } else if(event.fromelement){return event.fromelement; } else {return null; }}mouseマウスホイールの判断
MousedownおよびMouseUpイベントの場合、イベントオブジェクトにボタンプロパティが存在します。
押されたボタンまたはリリースボタンを示します。 DOMのボタン属性には、次の3つの値があります。0はメインマウスボタンを表し、1は中央のマウスを表します。
2はマウスボタンを示します。従来の設定では、メインマウスボタンは左マウスボタンと2番目のマウスです
ボタンは正しいマウスボタンです。
IE8および以前のバージョンもボタン属性を提供しましたが、この属性の値はDOMのボタン属性とは大きく異なります。
0:ボタンが押されていないことを意味します。
1:メインマウスボタンが押されていることを示します。
2:マウスボタンが2回押されていることを示します。
3:一次およびセカンダリマウスボタンが同時に押されていることを示します。
4:中央のマウスボタンが押されていることを示します。
5:メインマウスボタンとミドルマウスボタンが同時に押されていることを示します。
6:マウスボタンと中央のマウスボタンが同時に押されていることを意味します。
7:3つのマウスボタンが同時に押されていることを示します。
getButton:function(event){if(document.implementation.hasfeature( "mouseEvents"、 "2.0")){return event.button; } else {switch(event.button){ケース0:ケース1:ケース3:ケース5:ケース7:return 0;ケース2:ケース6:戻る2;ケース4:1を返します。 }}}mouseマウスホイールの増分値を取得する方法(デルタ)
getWheeldelta:function(event){if(event.wheeldelta){return(client.engine.opera && client.engine.opera <9.5?-event.wheeldelta:event.wheeldelta); } else {return -event.detail * 40; // firefoxの値は+3です。クロスブラウザーの方法でのキャラクターエンコードの取得
getCharCode:function(event){if(typeof event.charcode == "number"){return event.charcode; } else {return event.keycode; }}clipboardにアクセスしてください
getClipBoardText:function(event){var clipboarddata =(event.clipboarddata || window.clipboarddata); clipboarddata.getData( "テキスト"); }11.クリップボードにデータを設定します
setClipboardText:function(event、value){if(event.clipboarddata){return event.clipboarddata.setData( "Text/Plain"、value); } else if(window.clipboarddata){window.clipboarddata.setdata( "text"、value); }}カプセル化してから、直接使用できます。
CSS以上の完全なファイルとより基本的なリセットスタイルについては、https://github.com/luckywinty/resetfileについて
上記はこの記事に関するものです。すべての人の学習に役立つことを願っています。