<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
*{ margin:0; padding:0;}
ul{ list-style:none; overflow:hidden}
li{ width:200px; height:50px; overflow:hidden; border:1px solid;}
</style>
</head>
<body>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<script>
var Ary = document.getElementsByTagName("li");
function init(){
for(var i = 0; i < Ary.length; i++){
Ary[i].onclick = function(){
console.log(i);
};
};
};
//将变量i保存给每个段落对象li上 Ary[i].i = i
function solve(){
for(var i = 0; i < Ary.length; i++){
Ary[i].i = i;
Ary[i].onclick = function(){
console.log(this.i);
};
};
};
//将变量i保存在匿名函数自身(function).i = i
function solve2(){
for(var i = 0; i < Ary.length; i++){
(Ary[i].onclick = function(){
console.log(arguments.callee.i);
}).i = i;
};
};
//闭包,i以函数参数形式传递给内层函数(function(n){})(i)
function solve3(){
for(var i = 0; i < Ary.length; i++){
(function(n){
Ary[i].onclick = function(){
console.log(n);
};
})(i);
};
};
//闭包,i以局部变量形式传递给内存函数
function solve4(){
for(var i = 0; i < Ary.length; i++){
(function(){
var tmp = i;
Ary[i].onclick = function(){
console.log(tmp);
};
})();
};
};
//闭包,返回一个函数作为响应事件
function solve5(){
for(var i = 0; i < Ary.length; i++){
Ary[i].onclick = function(n){
return function(){
console.log(n);
};
}(i);
};
};
//用Function实现,实际上每产生一个函数实例就会产生一个闭包
function solve6(){
for(var i = 0; i < Ary.length; i++){
Ary[i].onclick = new Function("console.log(" + i + ")");
};
};
function solve7(){
for(var i = 0; i < Ary.length; i++){
Ary[i].onclick = Function("console.log(" + i + ")");
};
};
window.onload = solve7;
</script>
</body>
</html>