标签：

$(function() {

            //dom0级事件绑定
            var eleArr_d1 = $.makeArray($(".demo1").find(".layer1,.layer2,.layer3"));
            $.each(eleArr_d1, function (i, o) {
                o.onclick = fn0;
            });

            function fn0(e) {
                e = e || window.event;
                console.log("e.target=", getName(e.target));
                console.log("e.srcElement=", getName(e.srcElement));
                console.log("e.currentTarget=", getName(e.currentTarget));
                console.log("this=", getName(this));
                console.log("========================================================");
            }

            //dom2级事件绑定[IE]
            var eleArr_d2 = $.makeArray($(".demo2").find(".layer1,.layer2,.layer3"));
            if (document.attachEvent) {
                $.each(eleArr_d2, function(i, o) {
                    o.attachEvent("onclick", function() { fn2_ie.apply(o,arguments); });//改变this指向
                });
            } else {
                $(".demo2").find(".error").text("当前浏览器不支持attachEvent").show().css({ display: "inline-block" });
            }


            function fn2_ie(e) {
                e = e || window.event;
                console.log("e.target=", getName(e.target));
                console.log("e.srcElement=", getName(e.srcElement));
                console.log("e.currentTarget=", getName(e.currentTarget));
                console.log("this=", getName(this));
                console.log("========================================================");
            }


            //dom2级事件绑定[FF]
            var eleArr_d3 = $.makeArray($(".demo3").find(".layer1,.layer2,.layer3"));
            if (document.addEventListener) {
                $.each(eleArr_d3, function(i, o) {
                    if (o.addEventListener) o.addEventListener("click", fn3_ff, false);
                });
            } else {
                $(".demo3").find(".error").text("当前浏览器不支持addEventListener").css({display:"inline-block"});
            }

            function fn3_ff(e) {
                e = e || window.event;
                console.log("e.target=", getName(e.target));
                console.log("e.srcElement=", getName(e.srcElement));
                console.log("e.currentTarget=", getName(e.currentTarget));
                console.log("this=", getName(this));
                console.log("========================================================");
            }



            function getName(ele) {
                if (ele==null) {
                    return ele;
                }else if (ele.className) {
                    return ele.className;
                } else if (ele.tagName) {
                    return ele.tagName;
                }else if (ele.nodeName) {
                    return ele.nodeName;
                } else {
                    return ele;
                }
            }


        })

[JS学习笔记]浅谈Javascript事件模型

标签：

原文地址：http://www.cnblogs.com/hyaaon/p/4623613.html