zoukankan      html  css  js  c++  java
  • 【javascript每日一练】- 利用闭包

    <!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" />
    <title>闭包</title>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">
    $(function(){
    	$('#test li').click(function(){
    		var index=$('#test li').index($(this));
    		alert(index);	
    	})
    })
    </script>
    </head>
    
    <body>
    <ul id='test'>
        <li>这是第一条</li>
        <li>这是第二条</li>
        <li>这是第三条</li>
    </ul>
    </body>
    </html>
    

     利用闭包,代码简洁但增加了内存消耗

    	var ele=$('#test');
    	var liNode=ele.find('li');
    	var len=liNode.length;
    	for(var i=0;i<=len-1;i++){
    		liNode[i].onclick=(function(x){
    			return function(){
    				console.log(x);
    				//return x;
    			}
    		})(i)
    	}
    

     增加自定义属性,改变了html代码

        var ele=$('#test');
    	var liNode=ele.find('li');
    	var len=ele.find('li').length;
    	for(var i=0;i<=len-1;i++){
    		ele.find('li').eq(i).attr('index',i);
    		ele.find('li').eq(i).click(function(){
    			alert($(this).attr('index'));
    		})
    	}
    
  • 相关阅读:
    Infosec institute n00bs CTF writeup
    CTF学习之CODE
    ThinkPHP函数详解:C方法
    流程控制的替代语法
    Jquery DOM
    YII2 请求(request)
    YII2 运行概述(Overview)
    YII2 小部件(widgets)
    YII2 过滤器 filters
    YII2 随笔 视图最佳实践
  • 原文地址:https://www.cnblogs.com/positive/p/3596599.html
Copyright © 2011-2022 走看看