Event bubbling and event capture in JavaScript

Focus Event
Onfocus: Getting focus
Onblur: Losing focus

Event bubbling (and style independent, structure)
When an element receives an event, it propagates all the events he receives to his parent, always to the top window

Block bubbling:
Called in the event function that currently wants to block bubbling
Event.cancelbubble=true; Current object that blocks the current event

Event Capture:

Binding events:
1.obj.onclick=function () {}//an object with one event bound 2 functions will produce overrides
2.ie:obj.attachevent (' onclick ', fn1)
Standard: Obj.addeventlistener (' Click ', Fn1, capture)
The default is not to capture, bubbling

Problem:
The this point in IE under attachevent points to window
Call Method Fn1 () ==fn1.call () The first argument can change this point
Encapsulation of bound events:
function bind (OBJ,EVNAME,FN) {
if (Obj.addeventlistener) {
Obj.addeventlistener (Evname,fn,false)
}else{
Obj.attachevent (' on ' +evname,function () {
Fn.call (obj)
})
}
}

Go out and bubble, come in and catch
Event Capture:
Obj.addeventlistener (' click ', fn,true)

Event Cancellation:
1.obj.onclick=null; Assignment cancellation
2.ie:obj.dettachevent (OBJ,FN)
Standard: Obj.removeeventlistener (OBJ,FN, capture)

Event bubbling and event capture in JavaScript