本文主要是介绍addEventListener()及attachEvent()区别，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
今天仔细看了一下addEventListener() attachEvent()写篇博客记忆一下。
html代码很简单一句话：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title>
</head>
<body><input type="button" value="按钮" id="btn">
</body>
</html>js语法分别是 :
element.addEventListener(event, function, useCapture) //FF
attachEvent(event,function) //IE
<script type="text/javascript">window.onload =function () {var oBtn =document.getElementById('btn');//chromeoBtn.addEventListener("click", function(){alert('你好！')}, false)}</script><pre name="code" class="javascript"><script type="text/javascript">window.onload =function () {var oBtn =document.getElementById('btn'); //IEoBtn.attachEvent("onclick", function(){alert('你好！');})}</script>| 区别点 | addEventListener() | attachEvent() |
|---|---|---|
| 参数 | 3 | 2 |
| 事件 | click不需要“on” | onclick需要加“on” |
| 适应 | FF | IE |
个人感觉两者差不多！就是element.addEventListener()多一个useCapture参数。该参数默认为false
如果想看false和true 具体表现出来的效果，戳我！
为了让这个事件兼容 我写了以下方法
//compatible writingfunction addEvent(ele,eve,fn){if(ele.attachEvent){ele.attachEvent('on'+eve,fn);}else{ele.addEventListener(eve,fn,false);}}addEvent(oBtn,'click',function(){alert('你好！');})当然，网上有许多其他写法 比如这个比较全 。我这个写法 纯属加深自己的记忆，献丑了！
还有一个if else if的写法
var x = document.getElementById("btn");if (x.addEventListener){x.addEventListener("click", myFunction);}else if (x.attachEvent) {x.attachEvent("onclick", myFunction);}function myFunction() {alert("你好！");}这篇关于addEventListener()及attachEvent()区别的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
