自己收集原生js-2014-2-15

简介: function testforbtn(event){ alert(window.EventUtil.getEventTarget(window.EventUtil.getEvent( event))); //event.
function testforbtn(event){

    alert(window.EventUtil.getEventTarget(window.EventUtil.getEvent( event)));
    //event.target
    //event.type
    //event.currentTarget
    //event.srcElement

}

(function(){})(
    window.EventUtil={
        addHandler:function(element,type,handler){
           // alert(1);
            if(element)
            {
                //alert(2);
                if(element.addEventListener)
                {
                   // alert(3);
                    element.addEventListener(type,handler,false);
                }else if(element.attachEvent)
                {
                   // alert(4);
                    element.attachEvent("on"+type,handler);
                }else{
                   // alert(5);
                    element["on"+type]=handler;
                }

            }
        },
        removeHandler:function(element,type,handler){
            if(element)
            {
                if(element.removeEventListener){
                    element.removeEventListener(type,handler,false);
                }else if(element.detachEvent){
                    element.detachEvent("on"+type,handler);
                }else{
                    element["on"+type]=null;
                }
            }

        },
        addReady: function(fn){
            if(document.addEventListener){//兼容非IE
                document.addEventListener("DOMContentLoaded",function(){
                    //注销事件,避免反复触发
                    document.removeEventListener("DOMContentLoaded",arguments.callee,false);
                    fn();//调用参数函数
                },false);
            }else if(document.attachEvent){//兼容IE
                IEContentLoaded (window, fn);
            }
            function IEContentLoaded (w, fn) {
                var d = w.document, done = false,
                // only fire once
                    init = function () {
                        if (!done) {
                            done = true;
                            fn();
                        }
                    };
                // polling for no errors
                (function () {
                    try {
                        // throws errors until after ondocumentready
                        d.documentElement.doScroll('left');
                    } catch (e) {
                        setTimeout(arguments.callee, 50);
                        return;
                    }
                    // no errors, fire

                    init();
                })();
                // trying to always fire before onload
                d.onreadystatechange = function() {
                    if (d.readyState == 'complete') {
                        d.onreadystatechange = null;
                        init();
                    }
                };
            }
        },
        getEvent:function(event){
            return event?window.event:event;
        },
        getEventTarget:function(event){
            return event.target||event.srcElement;
        },
        preventDefault:function(event){
            if(event.preventDefault){
                event.preventDefault();
            }else{
                event.returnValue=false;
            }
        },
        stopPropagation:function(event){
            if(event.stopPropagation){
                event.stopPropagation();
            }
            else{
                event.cancelBubble=true;
            }

        }

        }
);



window.EventUtil.addReady(
    function(){
        var btn1=document.getElementById("mybtn");

        window.EventUtil.addHandler(btn1,"click",testforbtn);
    }
);
test
相关文章
|
6月前
|
前端开发 数据挖掘
第二十章 案例TodoList之动态数据
第二十章 案例TodoList之动态数据
|
Web App开发 JavaScript 前端开发
带你读《现代Javascript高级教程》三十、MutationObserver:监测DOM变化的强大工具(3)
带你读《现代Javascript高级教程》三十、MutationObserver:监测DOM变化的强大工具(3)
|
Web App开发 JavaScript 前端开发
带你读《现代Javascript高级教程》三十、MutationObserver:监测DOM变化的强大工具(1)
带你读《现代Javascript高级教程》三十、MutationObserver:监测DOM变化的强大工具(1)
|
JavaScript 前端开发
带你读《现代Javascript高级教程》三十、MutationObserver:监测DOM变化的强大工具(2)
带你读《现代Javascript高级教程》三十、MutationObserver:监测DOM变化的强大工具(2)
|
前端开发 JavaScript
前端动画(动态)图标库收集
前端动画(动态)图标库收集
151 0
|
JavaScript 前端开发 UED
前端祖传三件套JavaScript的DOM之事件的各种具体事件类型的焦点
在前端开发中,JavaScript 中的 DOM 事件机制提供了丰富的功能和灵活的方式来处理各种事件。本文将介绍 JavaScript 中常见的焦点事件类型,包括 focus、blur、focusin 和 focusout。
190 0
|
JavaScript 前端开发
前端祖传三件套JavaScript的DOM之事件的冒泡/捕获
在前端开发中,事件处理是非常重要的一部分。JavaScript 中的 DOM 事件机制提供了丰富的功能和灵活的方式来处理各种事件,并且事件的传播方式也是其中不可或缺的一部分。本文将介绍 JavaScript 中的事件传播方式:冒泡和捕获。
97 0
|
前端开发 JavaScript 开发者
前端祖传三件套JavaScript的DOM之事件的事件流
在前端开发中,事件流是一种非常重要的概念。通过了解事件流的原理,我们可以更加深入地理解 JavaScript 的 DOM 事件机制,并实现更加复杂的交互效果。本文将介绍 JavaScript 中的事件流。
112 0
|
JavaScript
Echart使用过程中问题总结
Echart使用过程中问题总结