1。従来のイベントモデル
従来のイベントモデルには制限があります。
インラインモデルは、HTMLタグ属性の形式で使用され、HTMLと混合されます。この方法は、間違いなく変更と拡張の問題を引き起こし、めったに使用されません。
スクリプトモデルは、イベント処理機能をJSファイルに書き込み、ページから要素を取得して、対応するイベント関数をバインドして実行をトリガーします。しかし、欠点もあります。
1. 1つのイベントは、複数のイベントリスニング関数をバインドし、後者は前者をオーバーライドします。
2。繰り返し結合を制限する必要があります
3.イベントオブジェクトを標準化します
2。現代のイベントバインディング
DOM2レベルのイベントは、イベントを追加および削除する2つの方法を定義します:AddEventListener()とremoveEventListener()。彼らは、イベント名、関数、泡、またはキャプチャされたブール値の3つのパラメーターを受け取ります(Trueはキャプチャ、Falseは泡立ちを意味します)。
それに応じて、IEは2つの同様のメソッドAccatedEvent()とDeTachevent()を提供しますが、IEの2つの方法には他の問題があります。このオブジェクトを渡すことは不可能です(これはIEポイントにウィンドウに)コールメソッドを使用してオブジェクトになりすまします。
関数addEvent(obj、type、fn){if(typeof obj.addeventlistener!= 'undefined'){obj.addeventlistener(type、fn、false); } else if(obj.attachevent!= 'undefined'){obj.attachevent( 'on' + type、function(){fn.call(obj、window.event);}); }};ただし、匿名関数は追加すると実行されるため、追加後に削除することはできません。さらに、IEで提供されるIEメソッドには、順番およびメモリリークでのバインディングイベントの実行の失敗などの問題もあります。
この一連の問題を解決するには、メソッドをさらにカプセル化し、他のブラウザにDOM2レベル標準を使用する必要があります。 IEの場合、従来のモードに基づいて追加と削除が採用されています。アイデアは次のとおりです。
1.追加は、JSのハッシュテーブルを使用してオブジェクトイベントを保存し、各オブジェクトイベントにID値を割り当て、まず同じ処理関数が追加の順に存在するかどうかを判断することです。存在しない場合は、イベントバインディング関数をハッシュテーブルに追加します。これにより、順番に実行できないという問題と繰り返しの追加が解決します。
2。削除するときは、トラバーサル関数の一致を判断するために使用されます。存在する場合、削除されます。
要約:
私は以前にJSイベントの拘束力をあまり深く理解していませんでしたし、従来のイベントバインディングモデルにとどまりましたが、プログラムの実装についてはまだ浅い理解がありました。今回、カプセル化ライブラリを学んだとき、JSで多くのオブジェクト指向のアプリケーションを学びました。 jQueryのようなJSライブラリは、データ結合メカニズムの良いカプセル化効果を達成していますが、理由はわからないが、理由はわからない。暗闇に保たれているという感覚があれば、特定の実装を自分で分析し、突然啓発を感じます。また、互換性のある汎用性の高いプログラムの良い仕事をするためには、多くのコンテンツを考慮して多くの問題を解決する必要があり、これらの問題の多くを徐々にクリアしていることを認識しています。