此文章是帮助班上的一个同学学习,本人菜鸟,请各路大神指点或者绕道
动态绑定事件在IE内核 和 火狐等相同的内核下分为两种情况 ,
1. attachEvent,
2.addEventListener
下面我们用代码的形式来演示
在火狐下运行:
<!DOCTYPE html> <meta charset="utf-8"> <html> <head> <title></title> <script type="text/javascript" src="NANF.js"></script> <script type="text/javascript"> function init(){ //初始函数 var testObj=document.getElementById("test"); //得到Id为test 的元素 testObj.addEventListener("click",function(){ alert("我在火狐下运行"); }); } </script> </head> <body onload="init()"> <input id="test" type="button" value="测试"> </body> </html>
注: addEventListener("click",function(){}) click 前面不用加 “on”
在IE下运行:
<!DOCTYPE html> <meta charset="utf-8"> <html> <head> <title></title> <script type="text/javascript" src="NANF.js"></script> <script type="text/javascript"> function init(){ //初始函数 var testObj=document.getElementById("test"); //得到Id为test 的元素 testObj.attachEvent("onclick",function(){ alert("我在IE下运行"); }); } </script> </head> <body onload="init()"> <input id="test" type="button" value="测试"> </body> </html>
为了兼容火狐和IE :
<!DOCTYPE html> <meta charset="utf-8"> <html> <head> <title></title> <script type="text/javascript" src="NANF.js"></script> <script type="text/javascript"> function init(){ //初始函数 var testObj=document.getElementById("test"); //得到Id为test 的元素 if(navigator.appName == "Netscape") { //判断是否为火狐 testObj.addEventListener("click",function(){ alert("都能运行"); }); } else { testObj.attachEvent("onclick",function(){ alert("都能运行"); }); } } </script> </head> <body onload="init()"> <input id="test" type="button" value="测试"> </body> </html>