js-dom-EventUtil 

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"/>
    <meta name="format-detection" content="telphone=no, email=no"/>
    <meta name="apple-touch-fullscreen" content="yes"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <title></title>
    <style type="text/css">
        .button {
            height: 2em;
            border: 0;
            border-radius: .2em;
            background-color: #34538b;
            color: #fff;
            font-size: 12px;
            font-weight: bold;
        }
    </style>
</head>
<body>
<input type="button" id="button" class="button" value="点击我，显示高度"/>
<a href="javascript:void (0);" id="link-a">标度</a>
</body>
<script type="text/javascript">
    //p361--高级程序3
    var myBtn=document.getElementById("button");
    myBtn.onclick=function(event){
       var event = EventUtil.getEvent(event);
        console.log("点击成功");
    };
    var myLink=document.getElementById("link-a");
    //用于取消事件的默认行为
    myLink.onclick=function(event){
        var event=EventUtil.getEvent(event);
        var target=EventUtil.getTarget(event);
        console.log(target); //输出：<a href="javascript:void (0);" id="link-a">标度</a>
    };
    //用于取消事件的默认行为
/*    myLink.onclick=function(event){
        var event=EventUtil.getEvent(event);
        var target=EventUtil.preventDefault(event);
    };*/

    var EventUtil = {
        /**
         * <br>给元素对象注册事件处理程序<br>
         * @param ele 要绑定的元素对象
         * @param type 事件名称,例如click、load等
         * @param handler 事件处理程序函数
         */
        registerEvent : function(ele, type, handler){
            // 支持IE9、Firefox、Safari、Chrome、Opera
            if (ele.addEventListener) {
                ele.addEventListener(type, handler, false);
            }
            // 支持IE浏览器
            else if(ele.attachEvent) {
                ele.attachEvent("on" + type, handler);
            }
            // 通过属性名的方式为元素指定事件处理程序
            else {
                ele["on" + type] = handler;
            }
        },
        //删除事件处理程序
        removeEvent : function() {
            if (ele.removeEventListener) {
                ele.removeEventListener(type, handler, false);
            } else if(ele.detachEvent) {
                ele.detachEvent("on" + type, handler);
            } else {
                ele["on" + type] = null;
            }
        },
        // 获取(DOM/IE中的)事件对象
        getEvent : function(event) {
            return event ? event : window.event;
        },
        // 返回事件的目标
        getTarget : function(event) {
            return event.target || event.srcElement;
        },
        // 取消事件冒泡
        stopPropagation : function(event) {
            if (event.stopPropagation) {
                event.stopPropagation();
            } else {
                event.cancelBubble = true;
            }
        },
        // 获取当前事件发生的对象
        preventDefault : function(event) {
            if (event.preventDefault) {
                event.preventDefault();
            } else {
                event.returnValue = false;
            }
        }


    }
</script>
</html>

　　

posted @ 2017-04-14 17:41  越来越好888  阅读(149)  评论(0)    收藏  举报