zoukankan      html  css  js  c++  java
  • 封装事件框架

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style>
            div{
                 100px;
                height: 100px;
                background: red;
            }
        </style>
    </head>
    <body>
    <button id="btn">按钮</button>
    <div id='div'></div>
    </body>
    <script src='itcast.js'></script>
    <script type="text/javascript">
    
        //测试
        $$.event.click('btn', function(){
            document.getElementsByTagName('div')[0].style.background = 'green'
        });
    
        $$.event.mouseover('div', function(){
            this.style.background = 'blue'
        });
    
        $$.event.mouseout('div', function(){
            this.style.background = 'pink'
        });
    
    </script>
    </html>

    使用 extend 改造

    $$.hover('div'   ,   function(){  }  ,  function(){  } ) ;

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style>
            div{
                 100px;
                height: 100px;
                background: red;
            }
        </style>
    </head>
    <body>
    <button id="btn">按钮</button>
    <div id='div'></div>
    </body>
    <script src='itcast2.js'></script>
    <script type="text/javascript">
    
        //测试
        $$.click('btn', function(){
            document.getElementsByTagName('div')[0].style.background = 'green'
        });
    
        $$.hover('div', function(){                    
            this.style.background = 'blue'
        },function(){
            this.style.background = 'pink'
        });
    
    </script>
    </html>
  • 相关阅读:
    SSIS -->> Data Type
    SSIS ->> Parameter
    Data Flow ->> Term Lookup
    Data Flow ->> Term Extraction
    Data Flow ->> Pivot
    Data Flow ->> OLE Command
    Data Flow ->> Multicast
    Data Flow ->> Union All
    Data Flow ->> Merge
    LeetCode OJ 118. Pascal's Triangle
  • 原文地址:https://www.cnblogs.com/shanlu0000/p/11605191.html
Copyright © 2011-2022 走看看