码迷,mamicode.com
首页 > 其他好文 > 详细

事件处理基础知识

时间:2016-05-29 18:31:37      阅读:126      评论:0      收藏:0      [点我收藏+]

标签:

事件处理分为DOM0,DOM2,DOM3事件。

DOM0就是直接通过 onclick写在html里面的事件, 比如:<input onclick="alert(1)" />,或者通过获取id的方式在js中直接添加onclick,比如document.getElementById("id").onclick。不能够添加多个事件方法,只显示最后一个。

DOM2是通过addEventListener绑定的事件, 还有IE下的DOM2事件通过attachEvent绑定。IE的事件流是冒泡, 从里面往上面冒。而现代浏览器默认冒泡,若将addEventListener的第三个参数设置为false,则为捕获。可以进行事件累加,addEventListener是DOM2,但attachEvent不是DOM2,是IE自己的方法,虽可以实现事件累加,但顺序是反着的。

 

 

比如如下代码: if(document.addEventListener){         //addEventListener是DOM2,
         p1.addEventListener("click",function(){
            alert("hello");     //现代浏览器,先显示hello,后显示hi
        },true);       //true - 事件句柄在捕获阶段执行;false-  默认。事件句柄在冒泡阶段执行
        p1.addEventListener("click",function(){
            alert("hi");
        },true);
        }else{       //兼容IE浏览器,此方法不是DOM2,可以添加多种事件方法,但是先显示hi再显示hello
        p1.attachEvent("onclick",function(){
            alert("hello");
        });
        p1.attachEvent("onclick",function(){
            alert("hi");
        });
        }

事件处理基础知识

标签:

原文地址:http://www.cnblogs.com/nicole2koala/p/5539913.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!