js window 事件

 window.onXX这个，在w3c规范中有专门的定义，叫DOM第0级事件模型。在当今所有的浏览器中都有实现。但是缺点是，只能绑定一个事件处理函数。且不具备多事件排程绑定的功能
addEventListener。在w3c标准中，叫DOM第2级事件模型。用来弥补window.onXX的不足。但是ie不支持，IE的多重事件绑 定方法是attachEvent。特别要说一下，attachEvent和addEventListener实现的功能并非是完全一样的。不同点如下：
1.attachEvent不支持捕获阶段，只支持冒泡阶段，而addEventListener可以通过最后一个参数设定
2.attachEvent在ie6（可能7上也有）在设置了handler function之后，在function内部调用this，并不能正确指向调用对象，而是直接指向了window。

所以一般绑定事件，如果要支持全浏览器，且不用绑定多个handler，建议用DOM第0级事件模型
如果要支持全浏览器，且需要绑定多个handler，不使用捕获阶段，可以用DOM第2级事件模型+attachEvent。
参考代码如下：

function addEventListener(control, eventName, fn) {
    if (window.attachEvent) {
        // 解决IE attachEvent this指向window对象的Bug
        control.attachEvent('on' + eventName, function(e) {fn.call(control, e);});
    } else if (window.addEventListener) {
        control.addEventListener(eventName, fn, false);
    } else {
        control['on' + eventName] = fn;
    }
}

 

<pre class="javascript" name="code">addEventListener = function() {
    if (window.attachEvent) {
        return function(control, eventName, fn) {
            // 解决IE attachEvent this指向window对象的Bug
            control.attachEvent('on' + eventName, function(e) {fn.call(control, e);});
        };
    } else if (window.addEventListener) {
        return function(control, eventName, fn) {
            control.addEventListener(eventName, fn, false);
        };
    } else {
        return function(control, eventName, fn) {
            control['on' + eventName] = fn;
        };
    }
};</pre><br>
<pre></pre>

 

 

js window 事件