define
DOM events are sent to notify the code that something has happened. Each Event is an object that inherits from the Event class and can include custom member attributes and functions to get more information about when the Event occurs. Events can represent everything from basic user interaction to automatic notification of events that occur in the render model.
Methods to bind events
1. Ele. Onxxx = function (event) {
2.ele.addEventListener(type, fn, false); IE9 is incompatible with binding multiple handlers to an event and executing them during capture when the third parameter is set to true, or executing handlers during bubble when the third parameter is set to true.
3. Ele. AttachEvent (” on “+ type, fn); Unique to IE, an event can also be bound to multiple handlers
The environment in which event handlers run
Ele.onxxx = function (event) {} this refers to the dom element itself
2.obj.addEventListener(type, func, false); The program this points to the DOM element itself
3. Obj. AttachEvent (” on “+ type, fn); The program this points to the window
Encapsulate compatible addEvent(elem, Type, Handle) methods
function addEvent(elem, type, handle) { if(elem.addEventListener){ elem.addEventListener(type, handle, false); } else if(elem.attachEvent) { elem.attachEvent(‘on’+ type, function(){ handle.call(elem); }) } else { elem[‘on’ + type] = handle; }}
Remove the event handler
Ele. Onclick = false/’/null; ele.removeEventListener(type, func, false); Ele. DetachEvent (” on “+ type, func); Note: If you bind an anonymous function, you cannot unbind it