JavaScript事件泡沫事件依頼

1570 ワード
イベント依頼 事件が勃発する javascript
事件が勃発する
IEのイベントフローはイベントバーストと呼ばれる.名前の通りに事件が発生したら、事件は中から外へ広がっていきます.下のコードを確認してください.

    
        
        Document

如果点击页面中的

元素，那么这个 chick 事件就会按照如下顺序传播：

click 事件 在 直系DOM 树的每一级节点都会发生（自下而上），直到 document 对象。

事件委托

又称事件代理。对“事件处理程序过多”问题的解决方案就是事件委托。事件委托利用了事件冒泡，只指定一个父类事件处理程序，就可以管理某一类型的所有子类元素事件。

    
    
  • 
    
  • 
    
  •
3つの
  • をクリックして、伝統的な方法で、彼らに単独でイベントを追加します.
    
    document.getElementById('sayHi').onClick(function(){...})
    イベントが多くない場合をクリックしてもいいです.すべての要素がこのような方式を採用すれば、結果として数え切れないコードがイベントを追加して処理します.一万人全員が会社のフロントに宅配を取りに行くような光景が壮観です.しかし、宅配をフロントに置いて、フロントで受け取って、ロットを分けて送ると、とても楽になります.
    
    document.getElementById('myList').onClick(function(ev){
        var e = ev || window.event;
        var target = e.target;
        switch (target.id) {
            case 'goSth':
                ...
                break;
            case 'doSth':
                ...
                break;
            ...
        }
    })
    上記はイベント依頼の方式で、サブ要素はイベント効果があります.イベントを依頼する時、要素のサブノードを遍歴する必要はなく、親レベルの要素にイベントを追加するだけでいいです.サブ要素はクリックして、親要素が追加された同じイベントをイベント泡の形でアクティブにします.多くのjsを減らしてdomの事件に対して操作して、更に少ないメモリを占有して、これは恐らく事件の委託の精髄のありかです.
    ボタンを使ったイベント(多くのマウスやキーボードイベント)は、イベント依頼に適しています.
    • JavaScriptはすべて対象ではありません.