-
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>DOM2事件</title> </head> <body> <input id="btn" type="button" value="按钮" /> </body> <script type="text/javascript"> function showMes(){ alert("hello world！") } var oBtn = document.getElementById("btn"); //根据浏览器的能力来选择处理方法，用对象进行封装 var eventHandle = { //添加事件 addEvent:function(ele, attr, fn){ //非IE浏览器DOM2事件处理 if(ele.addEventListener){ ele.addEventListener(attr, fn, false); } //IE DOM2事件处理 else if(ele.attachEvent){ ele.attachEvent('on'+attr, fn); } //DOM0 事件处理 else{ ele['on'+attr] = fn; } }, //删除事件 removeEvent:function(ele, attr, fn){ //非IE浏览器DOM2事件处理 if(ele.removeEventListener){ ele.removeEventListener(attr, fn, false); } //IE DOM2事件处理 else if(ele.detachEvent){ ele.detachEvent('on'+attr, fn); } //DOM0 事件处理 else{ ele['on'+attr] = null; } } } eventHandle.addEvent(oBtn, 'click', showMes); </script> </html>查看全部
-
IE浏览器事件处理程序： attachEvent()--添加事件 detachEvent()--删除程序 接受两个参数：事件处理程序名称，事件处理程序的函数。查看全部
-
DOM0和DOM2可以在一个元素上绑定多个事件处理程序，按顺序执行。查看全部
-
DOM2级事件，addEventListener()和removeEventListener().查看全部
-
把添加句柄和删除句柄封装到一个对象里面进行能力检测查看全部
-
HTML事件，和JS耦合太强。不符合结构、表现、行为相分离的原则。查看全部
-
IE事件处理程序，attachEvent(),detachEvent()查看全部
-
DOM2级查看全部
-
DOM0级事件处理程序：把一个函数赋值给一个事件处理程序的属性。查看全部
-
DOM事件对象，重要的方法和属性查看全部
-
event.stopPropagation()阻止事件冒泡查看全部
-
IE处理方法不同，事件名不用去掉on查看全部
-
dom2级事件处理，接收参数：1、事件属性（去除on）2、调用函数名 3、布尔值（一般用false，代表事件冒泡）。通过这种方式方式添加的只能用removeEventListener删除，且参数保持一致。dom级事件处理可以为一个元素添加多个事件（相同或不同，按顺序执行）查看全部
-
dom0级事件处理，在js中先取出元素，再添加事件属性查看全部
-
html事件处理查看全部
举报
0/150
提交
取消