事件的代理委托原理、优缺点。自定义事件

靠的事件的冒泡机制实现的

优点：

          1、可以大量节省内存的使用，减少注册事件，例如给table中的td事件，就添加到table上
          2、实现新增子对象时无需再次对其绑定事件。对于动态部分尤为适合

缺点：

          仅是上述1中类似的需求才会使用，使用场景比较少。

  function delegateEvent(interfaceEle,selector,type,fn){
        if(interfaceEle.addEventListener){
            interfaceEle.addEventListener(type.eventfn,false);
        }else{
            interfaceEle.attachEvent(type,eventfn);
        }

        function eventfn(e){
            var e = event || window.event;
            var target = e.target || e.srcElement;
            if(matchSelector(target,selector)){
                if(fn){
                    fn.call(target,e);
                }
            }
        }

        function matchSelector(ele,selector){
            if(selector.charAt(0) == "#"){
                  return ele.id == selector.slice(1);
            }
            if(selector.charAt(0) == "."){
                  return (""+ele.className+"").indexOf(""+ selector.slice(1)+"") != -1;
            }
            return ele.tagName.toLowerCase() == selector.slice(1).toLowerCase();
        }
  }

DOM自定义事件

不是由DOM触发的，它的目的是让开发人员创建自己的事件。
触发事件分别为dispatchEvent()和fireEvent()--IE

调用 createEvent("CustomEvent");
返回对象有一个名为initCustomEvent(),接受四个参数

       type(字符串)：触发的事件类型，例如“keydown”
       bubbles(布尔值)：表示事件是否应该冒泡
       cancelable(布尔值)：表示事件是否可以取消
       detail（对象）：任意值，保存在event对象的detail属性中。

例如：

    var div = document.getElementById("myDiv"),event;
    EventUtil.addHandler(div,"myevent",function(event){
        
    })
    
    if(document.implement.hasFeature("CustomEvents","3.0")){
        event = document.createEvent("CustomEvent");
        event.initCustomEvent("myevent",true,false,"Hello world!");
        //触发
        div.dispatchEvent(event);
    }
  

IE中模拟事件
document.createEventObject() 不接受参数
fireEvent()接受两个参数，事件处理程序的名称和event对象。在调用fireEvent（）方法的时候回自动为event对象添加SRCElement和type属性。其他属性则手动添加。

    var div = document.getElementById("myDiv");
    var event = document.createEventObject();
    event.screenX = 100;
    event.screenY = 100;
    event.clientX = 100;
    event.clientY = 100;
    event.ctrlKey = false;
    event.altKey = false;
    event.shiftKey = false;
    event.button = 0;

//触发
    div.fireEvent("onclick",event);