外观模式

        // 在项目中,团队开发过程中,如果你想给一个元素添加一个点击事件,另一个人也要添加点事件怎么办?
        // 封装一个类
        function addEvent (dom,type,fn){
            if(dom.addEventListener){
                dom.addEventListener(type,fn,false);
            }else if(dom.attachEvent){
                dom.attachEvent('on' + type, fn);
            }else{
                dom['on'+type] = fn;
            }
        }
        var box = document.getElementById('box');

        // 错误演示:
        box.onclick = function(){   // 甲给元素添加事件
            alert(1);
        }
        box.onclick = function(){   // 乙给元素添加事件
            alert(2);
        }
        // 上面案例 乙的点击事件覆盖甲的事件逻辑
        // 通过封装的小函数来实现:
        var box2 = document.getElementById('box2');

        addEvent(box2,'click',function(){
            alert(1);
        })
        addEvent(box2,'click',function(){
            alert(2);
        })
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容