装饰类设计模式

该设计模式在原有的事件内 想要增加函数或添加样式改变 使得该事件能够执行的范围更加广泛
例如 某一点击事件内 只改变了 颜色 但是想要该节点隐藏或者是另一个节点想要改变颜色等
body中分别有3个按钮

<script>
       var Button=document.getElementById('Button')
       var button1 =document.getElementById('1')
       var button2 =document.getElementById('2')
       Button.onclick=function(){
           console.log(button1.style.display)
           fn(button1)
       }
       function fn(button){         显示或者隐藏
        if(!button.style.display){
                       button.style.display='block'
                   }
                   else{
                       button.style.display=''
                   }
       }
       function fun(Button,fn){
           if(typeof Button.onclick==='function'){
               var prvicefn=Button.onclick     缓存 Button原本的点击事件函数
               input.onclick=function(){
                   prvicefn()               执行原本函数
                   fn(button2)              添加执行新的函数
               } 
           }
           else{                                        
            fn(button2)
           }
       }
       fun(Button,fn)    传参

该模式 主要在于 缓存原本点击事件的函数 在重写的点击事件执行并添加新的功能