分析JS高级绑定事件的几种方式

第一种绑定方式： html绑定 （把事件写在标签属性里）

  语法： <a href="http://bbs.aseoe.com/"  onclick="t();">爱思社区</a>

分析：这种方式 行为 结构不分离，效率较低  
              行为： 方法
              结构： div
              样式： css

第二种绑定方式： 对象属性方式

语法：  xxxDomObject.onclick = function(){
}

分析：这种方式 只能绑定一个事件
   如 一个页面中都写了onload事件，则后面的事件会将前面的onload的属性值给覆盖

window.onload = function(){
      alert('bbs.aseoe.com');
}

window.onload = function(){
      alert('爱思社区');
}
最终的结果是爱思社区 会将bbs.aseoe.com 覆盖


第三种绑定方式： addEventListener方式  （W3c中的标准）
  
    语法：xxxDomObject.addEventListener();

    var test = document.getElementById('test');
    test.addEventListener('click', function(){alert('爱思社区');},false);
    test.addEventListener('click', function(){alert('bbs.aseoe.com');},false); 

   注意： 1.事件名，一律不带on   (即 绑在 click，load，change，blur，focus，mouseover.. 等等）
               2.绑定事件函数中的"this"指绑定该事件的对象
               3.执行顺序，是按绑定的顺序来的

 分析JS高级绑定事件的几种方式