关于闭包面试题求解答

本帖最后由 wcpaxx 于 2013-02-22 17:09:57 编辑

解决方案 »

  1.   


    function init() {      
                var pAry = document.getElementsByTagName("p");      
                for( var i=0; i<pAry.length; i++ ) {      
                     pAry[i].onclick = (function(_i) {      
                                             alert(_i);      
                                        })(i);
              }  
            }
      

  2.   

    <!DOCTYPE HTML> 
    <html> 
    <head> 
    <meta charset="utf-8" /> 
    <title>闭包演示</title> 
    <style type="text/css"> 
        p {background:gold;}  
    </style> 
    <script type="text/javascript">   
    function init() {      
        var pAry = document.getElementsByTagName("p");      
        for( var i=0; i<pAry.length; i++ ) {      
             pAry[i].onclick = function(x) {      
                 return function(){alert(x);}      
             }(i)   
        }  
    }  
    </script>   
    </head>   
    <body onload="init();">   
    <p>产品 0</p>   
    <p>产品 1</p>   
    <p>产品 2</p>   
    <p>产品 3</p>   
    <p>产品 4</p>   
    </body>   
    </html>  
      

  3.   

    function init() {      
                var pAry = document.getElementsByTagName("p");      
                for( var i=0; i<pAry.length; i++ ) {      
                     pAry[i].onclick = (function(_i) {      
                                             return function(){
                                                alert(_i);   
                                             }                                               
                                        })(i);
              }  
            } 不好意思，忘记写return function...了。补上
      

  4.   


    <style type="text/css"> 
         p {background:gold;}  
     </style> 
     <script type="text/javascript">   
     function init() {      
         var pAry = document.getElementsByTagName("p");       
         for( var i=0; i<pAry.length; i++ ) {      
              pAry[i].onclick = (function(j){
      var a=function(){
     alert(j);
      }
      return a;    
              })(i)   
         }  
     }  
     </script>   
     </head>   
     <body onload="init();">   
     <p>产品 0</p>   
     <p>产品 1</p>   
     <p>产品 2</p>   
     <p>产品 3</p>   
     <p>产品 4</p>   
     </body>   
     </html>   
      

  5.   

    我的利用添加自定义属性的方式   function alertIndex3() {
                var p = document.getElementsByTagName("p");
                for (var i = 0; i < p.length; i++) {
                    p[i].index = i;
                    p[i].onclick = function () {
                        alert(this.index);
                    }
                }
            }
      

  6.   


    for后面的(i) 是什么作用  为什么除了就不行
      

  7.   

    请看下面一段代码，更容易理解function init() {      
        var pAry = document.getElementsByTagName("p"); 
        var delegate = function(x){
            return function(){alert(x)}
        }     
        for( var i=0; i<pAry.length; i++ ) {      
             pAry[i].onclick = delegate(i)   
        }
        pAry = delegate = null
        //把delegate 和 for连到一起就是上面的代码，建议使用这种方式，上面的代码有循环引用的嫌疑
    }