Foreach와 같은 jQuery


$.each(array,function(index, item){


var output='';



output+='<a href="'+item.link+'">';


output+='<h1>'+item.name+'</h1>';


output+='</a><br>';



document.body.innerHTML+=output;


})




forEach응용방법


array.forEach(function (item){


//console.log(item.name+' / '+item.link);



var output='';


output+='<a href="'+item.link+'">';


output+=item.name;


output+='</a><br>';



document.body.innerHTML+=output;



});




배열과 For문, 향상된 FOR문


 


<script type="text/javascript" src="./js/jquery-2.1.4.js"></script>


<script type="text/javascript">


    $(document).ready(function(){


        var array=[


                {name:'Naver',link:'http://www.naver.com'},


                {name:'Daum',link:'http://www.daum.net'},


                {name:'google',link:'http://www.google.com'}                


        ];


        //for    


        for(var i=0;i<array.length;i++){


            console.log(array[i].name+'/'+array[i].link);


        }


        for(var i in array){


            console.log(array[i].name+'/'+array[i].link);


        }


    });


</script>




배열관리 .each


 


<script type="text/javascript" src="./js/jquery-2.1.4.js"></script>


<script type="text/javascript">


    $(document).ready(function(){


        $('h2').each(function(index,item){


            //console.log(index);


            //console.log(item);


            //console.log(item.innerHTML);


            this.innerHTML='hello';


            


        })


    });


</script>


<body>


    <h2>item-0</h2>


    <h2>item-1</h2>


    <h2>item-2</h2>


    <h2>item-3</h2>


</body>




객체의 확장


 


<script type="text/javascript" src="./js/jquery-2.1.4.js"></script>


<script type="text/javascript">


    $(document).ready(function(){


        var object={name:'윤인성'};


        


        $.extend(object,{


            region:'서울특별시 강서구',


            part:'세컨드 기타'


        })


        


        var output='';


        $.each(object, function(key,item){


            output+=key+' : '+item+'\n';


        })


        alert(output);


    });


</script>


[출처] http://blog.naver.com/skawo32167/220493716793

+ Recent posts