Introducción a JQuery

Qué necesitas saber?

  • HTML
  • Javascript
  • CSS
  • AJAX
  • DOM (Modelo Objeto Documento)
  • CSS
  • Eventos HTML
  • Efectos
  • Animaciones

Qué contiene JQuery?

Qué es JQuery?

JQuery para que te enteres es una biblioteca de Javascript!!!Y para que te enteres mas aún, usar JQuery es mucho mas fácil de usar que el propio Javascript, te puedo asegurar que 5 líneas de código de Javascript se pueden substituir con una de JQuery

Por qué usar JQuery?

  • Es igual para todos los navegadores
  • Es rápido
  • Comodísimo
  • Si tienes algún problema con Javascript y le preguntas a un@ progrmador@ el 80% de sus respuestas serán: USA JQUERY!!!!!
  • Lo usan las grandes como Google
  • Es de las bibliotecas mas famosas y por lo tanto hay muchísima documentación
  • Fácil manejo del DOM
  • Fácil manejo de AJAX
  • Se carga al inicializar el DOM, no la página
  • Cambias rápidamente CSS o propiedades con JSON
  • Creación de animaciones sencillas

Qué mas necesitas saber? Cómo añado JQuery a mi página web?

La primera opción es descargar de la página de jquery.com un zip y añadirlo a tu servidor web, y en las páginas que tengas de tu web ir lincándolo en el head de cada página.

 src=»jquery-3.1.1.min.js»>

La segunda opción es no descargarlo, es decir, lincarlo también desde el head pero con una url exterior a tu servidor, una url de internet.

 src=»https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js»>

 La diferencia es la siguiente: Si lo tienes descargado en tu servidor, aun que no tengas internet puedes verlo en tu página , en local, es decir lo tipico cuando vas a localhost.

En cambio si lo tienes lincado desde internet en tu head, si no tienes conexión a internet, no lo podrás ver en local.

También tiene otras diferencias, pero como es una intro, no voy a extenderme.

Sintaxis de JQuery

La sintaxis se entiende como elijo un elemento.acción

Acción = modificar/acciones

La sintaxis básica es: $ (selector). acción()

  • Este signo $ para definir / acceder a jQuery
  • El (selector) para elejir elemento/s HTML
  • Una acción jQuery () para ejecutar sobre el/los elemento/s