闭包的应用很常规，作为一名前端，必须熟练掌握。那么来学个实例：点击列表li时打印其index值。应该怎么玩呢？这里介绍几种方法，如下：
第二种方法：
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
</style>
</head>
<body>
<ul id="test">
<li>这是第一条</li>
<li>这是第二条</li>
<li>这是第三条</li>
</ul>
<script type="text/javascript">
function $(id){
return document.getElementById(id);
}
// 方法1，直接给每个li添加index属性
var list = $("test").children;
for(var i=0; i<list.length; i++){
list[i].setAttribute("index", i);
list[i].onclick = function(){
alert(this.getAttribute("index"));
};
}
</script>
</body>
</html>第二种方法：
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
</style>
</head>
<body>
<ul id="test">
<li>这是第一条</li>
<li>这是第二条</li>
<li>这是第三条</li>
</ul>
<script type="text/javascript">
function $(id){
return document.getElementById(id);
}
// 方法2，使用闭包的方式
var list2 = $("test").getElementsByTagName("li");
for(var j=0;j<list2.length;j++){
list2[j].onclick = (function(num){
return function(){
alert(num);
};
})(j);
}
</script>
</body>
</html> 
网友评论文明上网理性发言 已有0人参与
发表评论: