hello1
     
 //方式1    
     
      hello2
     
 //方式2    
     
      hello3
     
 //方式3  
    

如果是方式1,2,function定义的时候也可以没有evt形参,但是被调用的时候一定会传递一个事件对象,如果有形参evt,则用evt接收,如果没有,可以在函数内直接通过event或arguments[0]访问.

如果是方式3,当是test()调用时,则不会传递事件对象,evt和arguments[0]均输出undefined.如果是test(evt)调用,则传递事件对象,evt和arguments[0]均输出事件对象

以下内容都是基于的总结

事件处理函数中,我们通常使用this来获取当前被操作的对象,但对于不同的事件绑定方式,this可能不一定指代的是当前被操作的对象.常见的事件绑定方式基本上是以下这些:

1.attachEvent: IE9以下(不包括IE9).2.addEventListener: 支持DOM Level2 Event的浏览器中.3.el.onclick = function() {}4.<div οnclick="handle()"></div>5.jQuery也提供了很多方法来方便地绑定事件.addEventListener是现代web应用中绑定事件的终极方法.

attachEvent与addEventListener的区别

1.支持的浏览器不同,attachEvent在IE9以下的版本中受到支持,其他的都支持addEventListener.2.参数不同,addEventListener第三个参数可以指定是否捕获,而attachEvent不支持捕获.3.事件名不同.attachEvent的第一个参数事件名前要加on.4.this不同.详情见下

attachEvent方式的事件绑定

attachEvent的this总是指向Window.例如:

el.attachEvent('onclick', function() {  alert(this);});

脚本设置onclick方式的事件绑定

设置DOM对象的onclick属性，this总是指向被设置的DOM元素。例如：

document.getElementById('id1').onclick = function() {  console.log(this);//
    
     ...
    
}

HTML中设置onclick方式的事件绑定

在HTML中设置onclick属性等于让Window调用该函数,于是this总是指向Window.例如:

addEventListener方式的事件绑定

addEventListener的this总是当前正在处理事件的那个DOM对象,DOM Level2 Event Model中提到,事件处理包括捕获阶段/目标阶段/冒泡阶段图片来源：事件当前正在流过哪个元素,this便指向哪个元素.比如两级的DOM:

点击div#l2后控制台输出为：

l1 capture 
    
     ​…​
    
​l2 target 
    
     ​
    
​l1 bubbling 
    
     ​…​
    
​

target与currentTarget

addEventListener的事件处理函数中的this不一定指向事实上被点击的元素,但事件处理函数的参数event对象提供了target和currentTarget属性来区分这当前对象和目标对象.我们可以将它们全部输出看看:

l1.addEventListener('click', function(e) {  console.log('l1 capture', this, e.currentTarget, e.target);});l2.addEventListener('click', function(e) {  console.log('l2 target', this, e.currentTarget, e.target);});l1.addEventListener('click', function(e) {  console.log('l1 bubbling', this, e.currentTarget, e.target);});

结果是:

l1 capture  
    
     ​…​
    
​  
    
     ​…​
    
​  
    
     ​
    
​l2 target   
    
     ​
    
​   
    
     ​
    
​   
    
     ​
    
​l1 bubbling 
    
     ​…​
    
​  
    
     ​…​
    
​  
    
     ​
    
​

可见currentTarget总是和this相同,而target指向事实上被点击的目标DOM对象.

关于XMLHttpRequest的兼容性

添加响应事件函数的兼容性