js相关事件总结

一.常见的实现事件的方式

   （1）html 中 onclick 属性 ；如<button  onclick ="test()">

   （2）js 中 onclick事件，如 document.getElementById("id").onclick=function(){};

   （3）W3C标准的addEventListener/removeEventListener，如document.getElementById("id").addEventListener("click",test,false); false 为事件捕获，true为事件冒泡；

   （4）微软attachEvent/detachEvent，如document.getElementById("id").attatchEvent("onclick",test);

推荐使用addEventListener，兼容性好，功能强大，代码结构清晰

 

二.事件流：事件的执行顺序，包括 冒泡，目标，捕获；

 

三.jquery 事件绑定方式

   （1）bind 匹配元素绑定，无过滤   浪费资源

   （2）live 匹配元素绑定，后继添加的新元素也如此，适用于未来元素  已经被淘汰

   （3）deleget 匹配元素绑定， 有过滤，适用于未来元素 来处理动态添加的元素

   （4）on  实现了上面的功能，适用于未来元素 (推荐)

四.dojo事件绑定方式dojo/on：dojo重新实现了浏览器的信息发布与接收机制，统一了事件的绑定方式，充分考虑到了内存泄漏，兼容性等问题

　（1）on(button,"click".test);支持w3c的对象属性和方法，例如stopPropagation，preventDefault，_handle_.remove

   （2）on方法，如query（’.clickable‘）.on("click",test)

   （3）事件代理：子元素的事件可以通过父元素来响应执行；on(parent element, "selector:event name",handler). 如on(parrentDom,'.clickable:click',test)

   （4）自定义事件（pub/sub框架）：pub发布topic和参数，sub监听topic和接收参数，如topic.publish('alert','hello');topic.subscribe('alert',fucntion(text){}); 应用：当前事件解决了不了的它来做

   （5）connect是旧方法

五.arcgis事件

　（1）on方法，如map.on('load',test)

   （2）connect,如connect.connect(map,'click',test)

对比：on比较好，一是connect是dojo旧方法，要淘汰；二是，on方法代码简洁，与其它语言的绑定事件方式相近；三是，on方法可以获得evt.target，这个对象信息是可信有用的

  （3）事件冒泡与阻止，如event.stop(event);