origType: "click",
selector: "#center",//选择器,用来区分不同事件源
type: "click"
}
1: {
data: undefined/{...},
guid: 3,
handler: function dot(){…},
namespace: "",
needsContext: false,
origType: "click",
selector: "#center",
type: "click"
}
2: {
data: undefined,
guid: 3,
handler: function dot(){…},
namespace: "",
needsContext: false,
origType: "click",
selector: undefined,
type: "click"
}
delegateCount: 2,//委托事件数量，有selector的才是委托事件
length: 3
}
}
handle: function ( e ) {…}/*事件处理主入口*/{
elem: document//属于handle对象的特征
}
}
jQuery的处理和Dean Edwards的跨浏览器兼容事件添加处理类似，比如为每一个函数添加guid；使用events对象存放响应事件列表，有一个总的事件处理入口handle等。
jQuery做了哪些改进？
1）事件数据不再直接保存在节点上，而是使用jQuery缓存系统内（内部使用的缓存jQuery._data方式存取）
2）事件委托：绑定到当前节点（例子中当前节点是document根节点）的处理函数不仅仅包含当前节点触发事件（click）响应时处理的事件（例子中selector为undefined时对应的处理函数dot）;还代理了其他节点（例子中的#center节点）触发事件（click）响应时处理的事件（例子中selector为”#center”对应的处理事件doHandler和dot）；委托机制在后续分析。
3）增加了很多功能数据，比如命名空间namespace:这个主要用在自定义事件自定义触发，比如$(document).on(“chua.click”,’#center’,dot)，主动触发$(“#center”).trigger(“chua.click”)。还有额外数据data:虽然没有看到那个地方有被用到。
到此jQuery的事件结构就清楚了。后面再分析事件的绑定和触发以及委托原理。
