Question

This program taken from a book Pro JavaScript Techniques is used to create hover-like functionality for an Element.

I don`t understand what the author means when he says, in the comments, Normalize the Event object.

Can you tell me

a) why is this necessary, explaining what would happen if it wasn`t normalized

b) how does the code provide achieve the effect

Thank you.

var div = document.getElementsByTagName('div')[0];

div.onmouseover = div.onmouseout = function(e) {

//Normalize the Event object
e = e || window.event;

//Toggle the background colover of the <div>
this.style.background = (e.type == 'mouseover') ? '#EEE' : '#FFF';

};

Answer 1

It’s referring to window.event, IE’s non-standard version of the event object. If it weren’t normalized, it would break in at least one browser.

What the code does is set e to itself (essentially a no-op), if the parameter is truthy (the event parameter is properly set). If not (in IE), it sets it to window.event.