简单闭包实例

<!DOCTYPE HTML>
<html lang="en-US">
<head>
 <meta charset="UTF-8">
 <title></title>
 <style type="text/css">
  *{margin:0;padding:0;}
  div span{float:left;display:inline;width:100px;height:30px;border:1px solid #f30;}
  div{clear:both;padding-top:10px;}
 </style>
</head>
<body>
<div id="box">
 <span>1</span>
 <span>2</span>
 <span>3</span>
 <span>4</span>
 <span>5</span>
</div>
<div id="box2">
 <span>1</span>
 <span>2</span>
 <span>3</span>
 <span>4</span>
 <span>5</span>
</div>

<div id="box3">
 <span>1</span>
 <span>2</span>
 <span>3</span>
 <span>4</span>
 <span>5</span>
</div>
<script type="text/javascript">
window.onload  = function () {
  var obox = document.getElementById('box');
  var obox2 = document.getElementById('box2');
  var obox3 = document.getElementById('box3');
  
  var nSpan = obox.getElementsByTagName('span');
  var nSpan2 = obox2.getElementsByTagName('span');
  var nSpan3 = obox3.getElementsByTagName('span');
  
  for (var i = 0; i < nSpan.length; i++){
   nSpan[i].onclick = new function () {
     var t = i;
     return function(){
      alert(t);
     }
    
   }
  }
  
  for (var i = 0; i < nSpan2.length; i++){
   nSpan2[i].onclick = function (i) {
    return function(){
     alert(i);
    }
   }(i)
  }
  
  for (var i = 0; i < nSpan3.length; i++){
   nSpan3[i].onclick = (function (i) {
    return function(){
     alert(i);
    }
   }(i))
  }
  
 }
</script> 
</body>
</html>
posted @ 2012-07-04 13:54  夜雨_Jason  阅读(229)  评论(0编辑  收藏  举报