JavaScript, mouse events

Event three elements:
Event Source {() event type (click onclick) = function.
Code executed after the event is triggered
}

Case:

ABB function (A) {
return document.getElementById (A);
}
. abb ( 'box') OnMouseEnter = function () {
// OnMouseEnter into mouse
// in the event, this refers to the event source
abb ( 'box') = .style.background 'Yellow';
}
ABB ( 'Box') OnMouseLeave = function () {.
// OnMouseLeave mouse out
this.style.background = 'Tomato';
}

ABB ( 'INPUT') the onfocus = function () {.
// the onfocus and onblur event specific form elements
ABB ( 'Box') = style.background 'Black';.
}
. ABB ( 'INPUT') onblur = function ( ) {
. ABB ( 'Box') style.background = 'Tomato';
}

 

onmouseover and onmoueout a group, it will trigger child elements
onmouseenter and onmouseleave a group, will not trigger sub-elements