addEventListener是一个监听事件并处理相应的函数,用于向指定元素添加事件句柄,可使用removeEventListener()方法来移除addEventListener()方法添加的事件句柄。
不啰嗦,直接上代码,如:
js部分
<script>
window.onload = function(){
var input = document.getElementsByTagName("input")[0];
if(input.addEventListener){
// 兼容主流浏览器,IE8及以下不支持
input.addEventListener("click",function(){
alert("按钮被点击了!")
},false) // 指定事件是否在捕获或冒泡阶段执行,false表示冒泡,true表示捕获,默认为冒泡
}else if(input.attachEvent){
// 兼容IE8及以下
input.attachEvent("onclick",function(){
alert("按钮被点击了!")
})
}
}
</script>
body部分:
<body>
<input type="button" value="按钮" />
</body>
注意:
addEventListener()方法,有3个参数。第一个参数是说明监听的事件类型(如:click,注意不要前缀on),第二个参数是事件执行的函数或方法,第三个参数则指定事件是否在捕获阶段执行,false表示冒泡,true表示捕获,默认为冒泡。该方法对于IE8及以下浏览器不支持。
attachEvent()方法,有2个参数。第一个参数是说明监听的事件类型(如:onclick,注意要前缀on),第二个参数是事件执行的函数或方法。支持IE8及以下版本浏览器