Páginas

▼
▼

sábado, 24 de agosto de 2019

jquery for each

Podemos crear bucles con un for tradicional o con each. Veamos un caso donde tenemos un array con una serie de tallas de camisas que deseamos listarlo por consola y por la página web.

El caso práctico se encuentra en el siguiente enlace.



HTML

En el body únicamente tenemos un div.

 <!DOCTYPE html>  
 <html>  
  <head>  
   <meta charset="utf-8">  
   <title>jQuery for each</title>  
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>  
   <script type="text/javascript" src="script.js"></script>  
  </head>  
  <body>  
   <div></div>  
  </body>  
 </html>

JavaScript + jQuery

Declaramos la variable tallas que es un array que contiene ocho tallas de camisa.
Con el for tradicional listamos las tallas en la página web con ayuda de append que añade las diferentes tallas al div, incluyendo cada una del loop al final.
Con each le pasamos el array y como segundo argumento lleva una función que lleva a su vez dos argumentos. El primero de ellos es el índice, index que hemos llamado i, y el segundo argumento es el valor del array que se va recorriendo secuencialmente.

 'use strict'  
 $(function(){  
  var tallas=["XXS","XS","S","M","L","XL","XXL","3XL"];  
  for(let i=0;i<tallas.length;i++){  
   $('div').append(tallas[i]+" ");  
  };  
  $.each(tallas, function(i,valor){  
    console.log(i+": "+valor);  
  });  
 });

en

No hay comentarios:

Publicar un comentario