onClick与addEventListener

<div id="div1" onclick="fn()"></div>
<script type="text/javascript">
	document.getElementById('div1').addEventListener('click',function(){
    
    
		alert(1)
	})
	document.getElementById('div1').addEventListener('click',function(){
    
    
		alert(2)
	})
	function fn(){
    
    
		alert(3)
	}
	function fn(){
    
    
		alert(4)
	}
	结果：
	4
	1
	2
</script>

一目了然：

1.onclick事件在同一时间只能指向唯一对象
2.addEventListener给一个事件注册多个listener
3.addEventListener对任何DOM都是有效的，而onclick仅限于HTML
4.addEventListener可以控制listener的触发阶段，（捕获/冒泡）。对于多个相同的事件处理器，不会重复触发，不需要手动使用removeEventListener清除
5.IE9使用attachEvent和detachEvent