JQUERY ¿Qué es JQuery?  jQuery es una biblioteca de JavaScript, creada inicialmente por John Resig, que permite simplificar la manera de interactuar con.

Presentación del tema: "JQUERY ¿Qué es JQuery?  jQuery es una biblioteca de JavaScript, creada inicialmente por John Resig, que permite simplificar la manera de interactuar con."— Transcripción de la presentación:

1

2 JQUERY ¿Qué es JQuery?  jQuery es una biblioteca de JavaScript, creada inicialmente por John Resig, que permite simplificar la manera de interactuar con los documentos HTML, manipular el árbol DOM, manejar eventos, desarrollar animaciones y agregar interacción con la técnica AJAX a páginas web. Fue presentada el 14 de enero de 2006 en el BarCamp NYC. jQuery es la biblioteca de JavaScript más utilizada.

3 JQUERY Características Selección de elementos DOM.
Interactividad y modificaciones del árbol DOM, incluyendo soporte para CSS 1-3 y un plugin básico de XPath. Eventos. Manipulación de la hoja de estilos CSS. Efectos y animaciones. Animaciones personalizadas. AJAX. Soporta extensiones. Utilidades varias como obtener información del navegador, operar con objetos y vectores, funciones para rutinas comunes, etc. Compatible con los navegadores Mozilla Firefox 2.0+, Internet Explorer 6+, Safari 3+, Opera y Google Chrome 8+.

4 JQUERY Información general Autor(es) John Resig Lanzamiento inicial
26 de agosto de 2006 (info) Última versión estable 3.2.1 (info) 20 de marzo de 2017 (2 meses y 3 días) Género Biblioteca Programado en JavaScript Sistema operativo Multiplataforma Licencia GPL y MIT Idiomas Inglés (documentación) En español No

5 JQUERY ORIGEN jQuery fue creado por John Resig quien estaba frustrado con lo difícil que era escribir JavaScript que funcionara en distintos navegadores y decidió escribir su propia biblioteca de JS para arreglar su problema: jQuery. El 16 de enero de 2006, John Resig dio una plática acerca de su nueva biblioteca en Bar Camp NYC, a un grupo pequeño de desarrolladores web locales A muchos desarrolladores web les encantó la sencillez y el poder de jQuery, y la biblioteca de John pronto creció en popularidad. Hoy, es la biblioteca más popular de JS en la web, y es mantenida por la jQuery Foundation, un equipo grande de voluntarios. El Soporte para AJAX fue agregado en febrero de 2006 y el modelo de licenciamientos open source del MIT fue adoptado en Mayo de ese mismo año.

6 Ventajas La ventaja principal de jQuery es que es mucho más fácil que sus competidores. Usted puede agregar plugins fácilmente, traduciéndose esto en un ahorro substancial de tiempo y esfuerzo. De hecho, una de las principales razones por la cual Resig y su equipo crearon jQuery fue para ganar tiempo (en el mundo de desarrollo web, tiempo importa mucho). La licencia open source de jQuery permite que la librería siempre cuente con soporte constante y rápido, publicándose actualizaciones de manera constante. La comunidad jQuery es activa y sumamente trabajadora. Otra ventaja de jQuery sobre sus competidores como Flash y puro CSS es su excelente integración con AJAX. En resumen: jQuery es flexible y rápido para el desarrollo web Viene con licencia MIT y es Open Source Tiene una excelente comunidad de soporte Tiene Plugins Bugs son resueltos rápidamente Excelente integración con AJAX

7 Desventajas Una de las principales desventajas de jQuery es la gran cantidad de versiones publicadas en el corto tiempo. No importa si usted está corriendo la última versión de jQuery, usted tendrá que hostear la librería usted mismo (y actualizarla constantemente), o descargar la librería desde Google (atractivo, pero puede traer problemas de incompatibilidad con el código). Además del problema de las versiones, otras desventajas que podemos mencionar: jQuery es fácil de instalar y aprender, inicialmente. Pero no es tan fácil si lo comparamos con CSS Si jQuery es implementado inapropiadamente como un Framework, el entorno de desarrollo se puede salir de control.

8 ¿Como incluir JQuery en un sitio web?
Existen dos principales caminos para empezar a usar JQuery en tu sitio web. Tu puedes: Descargar la librería JQuery desde jquery.com Incluir JQuery desde un CDN tales como Google y Microsoft.

9 Descargar JQuery Existen dos versiones de jQuery disponibles para descargar: Producción- Esta versión es para tu sitio web en producción por que ha sido minificada y comprimida. Desarrollo – Esta versión es para pruebas y desarrollo (descomprimido y código legible) Ambas versiones pueden ser descargadas desde jQuery.com. La librería jQuery es un simple archivo JavaScript, y lo referencias con la etiqueta <script> de HTML (note que la etiqueta <script> debería estar dentro de la sección <head>): <head> <script src="jquery min.js"></script> </head>

10 Usar un CDN Google CDN: Microsoft CDN:
<head> <script src=" </head> Microsoft CDN: <head> <script src=" </head>

11 Sintaxis de jQuery La sintaxis de jQuery está hecha a la medida para seleccionar elementos HTML y algunas acciones en los elementos. La sintaxis básica es: $(selector).action() Un símbolo de $ para definir/acceder a jQuery Un (selector) para "consultar o encontrar" elementos HTML Un jQuery action() para ser realizado en el elemento seleccionado Ejemplos: $(this).hide() - Oculta el elemento actual. $("p").hide() - Oculta todos los elementos <p>. $(".test").hide() - Oculta todos los elementos con class="test". $("#test").hide() - Oculta el elemento con id="test".

12 El evento Document Ready
Es recomendable usar jQuery dentro del evento document ready. Esto para prevenir que cualquier código jQuery se ejecute antes que el documento haya terminado de cargar. Para llamar al evento use uno de las siguientes opciones: $(document).ready(function(){    // jQuery methods go here... }); o $(function(){    // jQuery methods go here... });