閉包模塊化代碼js

時間 2019-11-07

原文原文鏈接

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript">
            window.onload=function()
            {
                var header=(function(){
                    var i=10;
                    var j=10;
                     function toJia(){
                         i++;
                         console.log(i)
                     }
                    
                    function toJian(){
                         j--;
                         console.log(j)
                     }
                    /*
                      閉包函數自執行以後header等於return 返回的json形式的對象
                     */
                    return{
                        Jia:toJia,
                        Jian:toJian
                    }
                    
                    i=j=null;
                    
                    
                })();
                console.log(header)//json對象
                console.log(header.Jia)//函數體
                header.Jia();//執行函數
                
                /*閉包解決循環變量的值*/
                var oul=document.getElementById('ul1');
                var ali=oul.getElementsByTagName('li');
                for(var i=0;i<ali.length;i++){
                    ali[i].onclick=function(i){
                        return function(){
                            alert(i);
                        }
                    }(i)
                }
            }
            
        </script>
    </head>
    <body>
        <ul id="ul1">
            <li>0</li>
            <li>1</li>
            <li>2</li>
        </ul>
    </body>
</html>

相關標籤/搜索