js解决事件对象兼容性问题

事件对象
-当事件的响应函数被触发时，浏览器每次都会将一个事件对象作为实参传递进响应函数
当事件对象中封装了当前事件相关的一切信息，比如：鼠标的坐标，键盘哪个按键被按下，鼠标滚轮滚动的方向等等，
-如onmousemove, 该事件将会在鼠标在元素移动时被触发

见如下代码：

div.onmousemove = function (e) {
        console.log(e);

        /*
        * clientX可以获取鼠标指针的水平坐标
        * clientY可以获取鼠标指针的垂直坐标
        * */
        var x = e.clientX; 
        var y = e.clientY;

        //在showMsg中显示鼠标的坐标
        showMsg.innerHTML = 'x = ' + x + ', y = ' + y; 
};

然而，在IE8中，响应函数被触发时，浏览器不会传递事件对象。

在IE8及以下的浏览器中，是将事件对象作为window对象的属性保存的。

即通过以下代码获得：

var x = window.e.clientX; //兼容IE8及以下
var y = window.e.clientY;

但是这样又会导致不兼容火狐浏览器

解决方法为：

div.onmousemove = function (e) {
    //法1
    if (!e) {
       e = window.e;
    }
    var x = e.clientX;
    var y = e.clientY;
    
    //在showMsg中显示鼠标的坐标
    showMsg.innerHTML = 'x = ' + x + ', y = ' + y;
}

div.onmousemove = function (e) {
    //法2：
    e = e || window.e;
    var x = e.clientX;
    var y = e.clientY;

    //在showMsg中显示鼠标的坐标
    showMsg.innerHTML = 'x = ' + x + ', y = ' + y;
}