1.element.dispatchEvent()对于标准浏览器，它提供了元素触发自定义事件的方法：element.dispatchEvent()。但是，在使用这个方法之前我们还需要做两件事，即创建和初始化。document.createEvent()event.initEvent()element.dispatchEvent()例如：vardom=document.querySelector('#id')dom.addEventListener('alert',function(event){console.log(event)}，错误的）;//创建varevt=document.createEvent("HTMLEvents");//初始化evt.initEvent("alert",false,false);//触发，即弹出文本dom.dispatchEvent(evt);1.createEvent()createEvent()方法返回新创建的Event对象，支持一个参数表示事件类型，详见下表：参数参数事件接口初始化方法HTMLEventsHTMLEventinitEvent()MouseEventsMouseEventinitMouseEvent()UIEventsUIEventinitUIEvent()2、initEvent()initEvent()方法用于初始化通过DocumentEvent接口创建的Event的值。支持三个参数：initEvent(eventName,canBubble,preventDefault)分别表示：事件名是否可以冒泡，是否阻止事件默认运行3.dispatchEvent()dispatchEvent()是触发执行，dispatchEvent()dom的参数eventObject。事件对象是createEvent()方法返回的创建的Event对象。二、自定义事件1、Event自定义事件的作用包括Event、CustomEvent和dispatchEvent//向窗口派发一个resize内置事件window.dispatchEvent(newEvent('resize'))//直接自定义事件并使用Event构造函数：varevent=newEvent('build');varelem=document.querySelector('#id')//监听事件elem.addEventListener('build',function(e){...},false);//触发event.elem.dispatchEvent(event);2.CustomEventCustomEvent可以创建一个自定义程度更高的事件，也可以附加一些数据。具体用法如下：varmyEvent=newCustomEvent(eventname,options);whereoptionscanbe:{detail:{...},bubbles:true,//是否冒泡cancelable:false//是否取消默认事件}其中detail可以存储一些初始化信息，触发时调用。其他属性就是定义事件是否有冒泡等等。内置事件会由浏览器根据某些操作触发，而自定义事件则需要手动触发。dispatchEvent函数用于触发一个事件：element.dispatchEvent(customEvent);上面的代码表示在元素上触发了customEvent事件。组合是：//添加适当的事件listenerobj.addEventListener("cat",function(e){process(e.detail)});//创建并发送eventvarevent=newCustomEvent("cat",{"detail":{"hazcheeseburger":true}});obj.dispatchEvent（事件）；使用自定义事件需要注意兼容性问题，但是使用jQuery就简单多了：//Bindcustomevents$(element).on('myCustomEvent',function(){});//触发事件$(element).trigger('myCustomEvent');//另外在触发自定义事件时还可以传递更多的参数信息：$("p").on("myCustomEvent",function(event,myName){$(this).text(myName+",你好！");});$("button").click(function(){$("p").trigger("myCustomEvent",[“约翰”]）;}）;3、由于IE浏览器很多版本不支持document.createEvent()方法，我们需要另辟蹊径（据说IE有document.createEventObject()和event.fireEvent()方法，但不支持自定义事件~~）。IE浏览器有很多自给自足的东西，比如下面要说的“propertychange”事件，顾名思义就是一个属性发生变化时触发的事件。比如文本框的值发生变化，或者元素id发生变化，或者绑定的事件发生变化等。dom.evtAlert="2012-04-01";
dom.attachEvent("onpropertychange",function(e){if(e.propertyName=="evtAlert"){fn.call(this);}});这样，当我们需要触发自定义事件时，只需修改DOM上自定义evtAlert属性的值即可：dom.evtAlert=Math.random().toString(36).substr(2)触发绑定在onpropertychange事件上dom，并且因为修改的属性名称恰好是“evtAlert”，所以自定义的fn会被执行。这就是完整的IE浏览器下的事件触发机制，应该说是相当详细了。3、自定义事件的删除与触发事件不同。对于事件删除，各个浏览器都提供了相应的事件删除方法，如removeEventListener、detachEvent。但是对于IE浏览器，还需要删除一个事件，就是额外增加的触发函数的onpropertychange事件：dom.detachEvent("onpropertychange",evt);varfireEvent=function(element,event){if(document.createEventObject){//IE浏览器支持fireEvent方法varevt=document.createEventObject();returnelement.fireEvent('on'+event,evt)}else{//其他标准浏览器使用dispatchEvent方法varevt=document.createEvent('HTMLEvents');evt.initEvent（事件，真，真）；返回!element.dispatchEvent(evt);}};参考：http://www.zhangxinxu.com/wor...
