Cross-browser event handlers and cross-browser events

Cross-browser event handlers and cross-browser events

Var eventUtil = {// defines an object addEventHandler: function (element, type, handler) {// handler is the trigger operation, that is, function. When passing parameters, function is not enclosed in parentheses. If (element. addEventListener) {// supports dom2-level elements. addEventListener (type, handler, false);} else if (element. attachEvent) {// supports ieelement. attachEvent ('on' + type, handler);} else {element ['on' + type] = handler; // not used here. the reason is. A variable cannot be connected to a string, in fact any. can be represented in brackets}, removeEventHander: function (element, type, hander) {if (element. removeEventListener) {// do not add parentheses to check whether it has this attribute element. removeEventListener (type, hander, false); // brackets must be added here} else if (element. detachEvent) {element. detachEvent ('on' + type, hander);} else {element ['on' + type] = null ;}}}

Event object: An event object is generated when a dom event is triggered.

Event object in dom: event

1. The type attribute is used to obtain the event type.

2. The target attribute is used to obtain the event target.

 

Event bubbling: if you trigger an event of a child element, the browser triggers the event of the parent element of the child element by default.

3. method to prevent event bubbling: event. stopPropagation (), which is placed in the handler of the child element.

4. The preventDefault () method blocks the default action of an event. For example, the default action of tag a is to jump.

Event object in ie: window. event

1. type attribute, used to obtain the Event type

2. srcElement attribute, used to obtain the event Target

3. cancelBubble is used to prevent event bubbles

4. returnValue is used to block the default action of an event.