Empezando con jQuery

Siempre he sido de escribir el código javascript a saco, tiene su mérito pero es complicarse la vida

Estos días he estado probando la librería jQuery y me gustaría recomendarla a la gente cabezuda como yo y también a los que quieran empezar con el javascript.

¿Que es jQuery?

es una librería (Framework) JavaScript diseñada para “simplificar” tareas comunes

¿En que me puede ayudar?

  1. Escribirás menos
  2. Ahorras tiempo tanto en la creación como en la edición
  3. El código será más limpio y comprensible
  4. La aplicación que programes, será compatible con la mayoría de navegadores (IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+)

Descargar jQuery:

Pagina oficial (la edición comprimida sólo ocupa 20kb)

Ejemplos:

1-Método tradicional de toda la vida
2-Método utilizando jQuery

1-document.getElementById(‘id_objeto’ ).innerHTML = ‘esto es una prueba’
2-$(‘#id_objeto’).html(‘esto es una prueba’)

1-alert(document.getElementById(‘id_objeto’ ).innerHTML)
2-alert($(‘#id_objeto’).html())

1-document.getElementById(‘id_campo_formulario’ ).value=12
2-$(‘#id_campo_formulario’).val(12)

1-alert(document.getElementById(‘id_objeto’ ).value)
2-alert($(‘#id_campo_texto’).val())

1-document.getElementById(‘id_objeto’ ).style.display=’none’
2-$(‘#id_objeto’).hide()

1-document.getElementById(‘id_objeto’ ).style.display=”
2-$(‘#id_objeto’).show()

1-this.disabled=true;
2-$(this).attr(‘disabled’,true);

1-document.getElementById(‘id_objeto’ ).style.backgroundColor=’#ff0000′
2-$(‘#id_objeto’).css(‘backgroundColor’,'#ff0000′);

1-if(document.getElementById(‘id_objeto’) .checked){}
2-if($(‘#id_objeto’).is(‘:checked’)){}

1-function mostrar(id){
obj = document.getElementById(id);
obj.style.display = ((obj.style.display)? ” : ‘none’);
}
mostrar(‘id_objeto’);

2-$(‘#id_objeto’).toggle();

Nota:

document.getElementById(‘id_objeto’) y $(‘#id_objeto’), no es exactamente lo mismo, por ejemplo no puedes hacer:
$(‘#id_objeto’).style.display=”

Más recursos:

Javascript      30 Julio, 2007      15673 lecturas      15 comentarios

▶ Ver 1 pings y 0 trackbacks

  1. Alex

    No, por favor, más jquery no!


    Tienes que pasarte a MooTools. Este framework es DIOS. Te puedo dar muchas razones para usarlo, pero bastaría con mencionar que la -santísima- W3C lo usa en su página.


    Igualmente te nombraré algunas de sus ventajas:

    1.- Es escalable, dependiendo de tus necesidades, el archivo se adapta, para no cargar cosas de más.

    2.- Está orientado tremendamente a Clases, y las maneja como nadie.

    3.- Es más indicado para desarrolladores. Mientras que otros frameworks buscan que pueda ser usado por gente sin conocimientos, MooTools se encarga de que un desarrollador se encuentre “como en casa”, con el máximo de herramientas útiles para crear un software símple o complejo.

    4.- Joder, Mola.

    5.- Va, tio, no te lo pienses más. Haz tus herramientas con MooTools.

    6.- http://mootools.net/download/release

    7.- http://docs.mootools.net/



  2. ImZyos!

    Pesada, no orientada a objetos, poco extendible, MooTools Rocks!



  3. hanok

    A mi también me han gustado más las MooTools… :D



  4. gafeman

    holas gracias por los comentarios,

    a mi lo que me ha convencido de jquery son la cantidad de ejemplos que he encontrado


    ¿saben alguna pagina donde encontrar buenos ejemplos de mootools?


    la verdad es que tengo malas experiencias con mootools, por ejemplo a la hora de seleccionar las partes de la libreria, no se cuales son las que realmente necesito


    ¿la sintaxis varia bastante de la de jquery ?

    por lo que visto la mayoria usan $(‘#id_objeto’), ¿hay mas coincidencias?



  5. luigix

    Gracias gafeman por recordarme que existe jQuery ! Llevo tiempo pensando que tengo que meterme y usarlo, porque con un poco de práctica me ahorraré un montón de código, pero nunca encuentro el momento de hacerlo… a ver si ahora me animo !



  6. Alex

    Si necesitas cualquier cosa referente a Mootools, pide por esa boquita.


    Buenos ejemplos de MooTools:

    http://demos.mootools.net/


    Completa documentación:

    http://docs.mootools.net/


    Sites importantes que usan MooTools:

    - validator.w3 .org

    - cnet .com

    - joomla .org

    - quizlet .com

    - vimeo .com

    - ubuntu .com

    - gamespot .com


    Orientado a objetos (la mejor forma de programación)

    [ http://es.wikipedia.org/wiki/Programaci%C3%B3n_orientada_a_objetos ]


    El colega de Jourmoly está escribiendo tutos muy buenos de cómo usar MooTools en español [ http://www.jourmoly.com.ar/ ]


    Estoy trabajando personalmente en una documentación completa en español de MT [ http://zumbe.net/bin/moofind ]


    Sólo faltas tú.



  7. Angelfire

    Yo ni sabia por cual empezar, he visto que moontools y jQuery se dan la guerra, vamos a ver.


    Gracias a los que comentaron a favor de moontools, leere ;)



  8. gafeman

    @Angelfire: a mi me gusta mas jquery para mi es mas facil


    aqui tienes una lista de plugins:

    http://plugins.jquery.com/


    documentacion:

    http://docs.jquery.com/Main_Page


    algunas demos:

    http://interface.eyecon.ro/demos



  9. /grunch0

    Ahora me estan siendo muy útile estos servicios.



  10. Hipolyto

    Por algo Google y Microsoft escogio jquery como fraemwork…….



  11. UnoKPasabaXAquí

    Un gran artículo ;)



  12. Covi

    Hace tiempo pero… no podía dejarlo pasar.

    Ahora mismo, el gran atractivo de jQuery es una interfaz de usuario estándar y oficial… pero el proceso natural de cualquier… digamos desarrollador que aprende Javascript, creo que es -o fue en su día-:


    #-> Prototype -> Prototype + scrip.aculo.us -> quizá algún otro como ExtJs, etc, antes de jQuery:

    En este punto te estancas en la comodidad de jQuery hasta que empiezas a necesitar manipular el DOM de forma más intensa o distinta del DOM HTML: Namespaces xml, otros formatos como SVG…


    La solución pasa por volver a un framework robusto, sólido y básico, que trabaje con el DOM puro:


    -> Vuelves a Prototype:

    Mola y empiezas a extenderlo pero… quieres automatizar cosas: un constructor de clases, automatizar efectos, todo válido para cualquier DOM y tal…


    -> Descubres que estás haciendo lo que ya hace MooTools:

    Lees la documentación, lo pruebas… lo extiendes sencilla y potentemente, haces birguerías tú solo! (dices: no me lo puedo creer)…


    -> te pasas a MooTools -> migras tu código jQuery a MooTools en un santiamén y de forma más robusta y potente…


    -> MooTools es Dios -> MooTools Rocks!!


    ^^!



  13. Covi

    Mmmm… un apunte importante:

    Cada uno, desde luego, hace lo que dice y tienen un objetivo algo distinto:


    jQuery está dedicado a: no complicarte la vida al escribir Javascript, siempre con el DOM HTML -a no ser que se extienda con plugins-.


    MooTools, sencillamente es: Lo que debería ser Javascript. Lo cual a mí me parece genial y perfecto.



  14. CjKun

    Jajajaja
    creo q voy dentro del proceso q describe Covi,
    aunq la verdad me he sentido mucho mas comodo utilizando prototype…
    posiblemente su comunidad no sea tan extensa como la de jquery q admito ha tenido un crecimiento importante,
    pero no te permite hacer muchas cosas aún, y tienes q volver a prototype o pasarte a mootools..


    esta ultima no la he utilizado mucho, primordialmente porq no es compatible con prototype, y lo muy poco q la he usado no me ha convencido, pero debido a los comentarios que otros han puesto aqui, creo q tendré q darle un vistaso muy pronto..


    saludos









Additional comments powered by BackType