Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: Lupin en 18 Septiembre 2012, 18:49 pm



Título: Podrian ayudarme a entender este codigo en Jquery
Publicado por: Lupin en 18 Septiembre 2012, 18:49 pm
Hola estoy tratando de incorporar un script a mi web y resulta que tengo que entenderlo primero , pero no se mucho de Java sript. Este es un fragmento del codigo, en realidad no es la logica lo que me intriga sino la declaracion de los tags por ejemplo esta linea  se que agrega  clases pero a ¿una variable?
Código
  1. $articulo.addClass('articulo');
Gracias por su tiempo


Código
  1.  
  2.  
  3. function agregar_articulos(lista_articulos)
  4. {
  5. //Contenedor de los articulos
  6. var $contendor_principal = $('#articulos-wp');
  7.  
  8. //Descomentar para ver el formato en que llegan los datos
  9. //console.log(lista_articulos)
  10.  
  11. //Recorro el objeto JSON
  12. for( var i = 0; i < lista_articulos.length; i++ ){
  13.  
  14. /*
  15. * Creo los tags que contendran la info de cada articulo
  16. */
  17. var $articulo          = $('<article> </article>');
  18. var $articuloHeader    = $('<header> </header>');
  19. var $articuloTitulo    = $('<h1>');
  20. var $articuloFecha     = $('<span>');
  21. var $articuloContenido = $('<div>');
  22.  
  23. //addClass es un metodo jQuery, agrega una clase CSS al elemento
  24. $articulo.addClass('articulo');
  25.  
  26. //Agrego el texto del titulo y la fecha.
  27. $articuloTitulo.text( lista_articulos[i].titulo );
  28. $articuloFecha.text( lista_articulos[i].fecha );
  29.  
  30.  
  31. $articuloContenido.addClass('contenido');
  32. $articuloContenido.text(lista_articulos[i].encabezado);
  33.  
  34. /*
  35. * Utilizo el metodo .append() para insertar los elementos o tags
  36. * dentro de sus padres.
  37. */
  38.  
  39. $articuloHeader.append($articuloTitulo);
  40. $articuloHeader.append($articuloFecha);
  41.  
  42. $articulo.append($articuloHeader);
  43. $articulo.append($articuloContenido);
  44.  
  45. ///Por ultimo agrego el articulo completo al contenedor de estos.
  46. $contendor_principal.append($articulo);
  47. }
  48. }
  49.  
  50.  
  51.  


Título: Re: Podrian ayudarme a entender este codigo en Jquery
Publicado por: moikano→@ en 18 Septiembre 2012, 19:24 pm
No es que sepa mucho de javascript, de echo estoy aprendiendo ahora.

Citar
por ejemplo esta linea  se que agrega  clases pero a ¿una variable?

Creo que lo que hace es añadir la clase artículo a una etiqueta artículo. Como bien se ve en la parte inicial del for.

Código
  1. var $articulo          = $('<article> </article>');

Básicamente lo que hace el script es con un bucle crear una sección html con el contenido de un array que se llama "lista_articulos".


Título: Re: Podrian ayudarme a entender este codigo en Jquery
Publicado por: EFEX en 18 Septiembre 2012, 19:32 pm
Si, como dice moikano→@, pero por que no prestas atencion a los comentarios que dejo el programador?

...en realidad no es la logica lo que me intriga sino la declaracion de los tags por ejemplo esta linea  se que agrega  clases pero a ¿una variable?
Código
  1. $articulo.addClass('articulo');

Como dice el comentario del programador...
Código
  1. //addClass es un metodo jQuery, agrega una clase CSS al elemento
  2. $articulo.addClass('articulo');
  3.  

JQUERY .addClass()
http://api.jquery.com/addClass/


Título: Re: Podrian ayudarme a entender este codigo en Jquery
Publicado por: Lupin en 18 Septiembre 2012, 19:52 pm
tienes razon jeje   ;D. Lo de agregar clases creo que si lo entiendo lo que necesito que me aclaren es  el asunto de declarar etiquetas por ejemplo "<articulo></articulo>" como se comportan esas etiquetas como ¿div ? como ¿Class? Aunque segun estoy googleando creo que es HTML5


Título: Re: Podrian ayudarme a entender este codigo en Jquery
Publicado por: EFEX en 18 Septiembre 2012, 19:58 pm
tienes razon jeje   ;D. Lo de agregar clases creo que si lo entiendo lo que necesito que me aclaren es  el asunto de declarar etiquetas por ejemplo "<articulo></articulo>" como se comportan esas etiquetas como ¿div ? como ¿Class? Aunque segun estoy googleando creo que es HTML5

Asi es, es html5.

HTML5 Tag Reference
http://www.w3schools.com/html5/html5_reference.asp


Título: Re: Podrian ayudarme a entender este codigo en Jquery
Publicado por: Agente Naranja en 20 Septiembre 2012, 01:41 am
Después de ejecutar ese addclass, supongo que es como si tuvieras:

<article class="articulo"> </article>

el addClass es para añadir las clases en CSS