JQUERY

JQUERY

1. ¿Qué es JQUERY?

   • jQuery es una biblioteca multiplataforma 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
     • ¿Quién es John Resig?
       • John Resig es un programador y empresario, conocido por ser el Evangelista de JavaScript de la Fundación Mozilla, creador y líder de desarrollo de la biblioteca JavaScript jQuery, autor de un libro técnico sobre JavaScript y de uno de los blogs más leídos, con una media de 13.000 suscriptores.
   • jQuery es software libre y de código abierto, posee un doble licenciamiento bajo la Licencia MIT y la Licencia Pública General de GNU v2, permitiendo su uso en proyectos libres y privados. jQuery, al igual que otras bibliotecas, ofrece una serie de funcionalidades basadas en JavaScript que de otra manera requerirían de mucho más código, es decir, con las funciones propias de esta biblioteca se logran grandes resultados en menos tiempo y espacio.
     • ¿Qué es el GNU?
       • La Licencia Pública General de GNU o más conocida por su nombre en inglés GNU General Public License (o simplemente sus siglas en inglés GNU GPL) es una licencia de derecho de autor ampliamente usada en el mundo del software libre y código abierto,​ y garantiza a los usuarios finales (personas, organizaciones, compañías) la libertad de usar, estudiar, compartir (copiar) y modificar el software. Su propósito es doble: declarar que el software cubierto por esta licencia es libre, y protegerlo (mediante una práctica conocida como copyleft) de intentos de apropiación que restrinjan esas libertades a nuevos usuarios cada vez que la obra es distribuida, modificada o ampliada. Esta licencia fue creada originalmente por Richard Stallman fundador de la Free Software Foundation (FSF) para el proyecto GNU.
   • La sintaxis de JQuery está diseñada para facilitar la navegación por un documento, seleccionar elementos DOM, crear animaciones, manejar eventos y desarrollar aplicaciones AJAX. JQuery también proporciona capacidades para que los desarrolladores creen complementos en la parte superior de la biblioteca de JavaScript. Esto permite a los desarrolladores crear abstracciones para interacción y animación de bajo nivel, efectos avanzados y widgets temáticos de alto nivel. El enfoque modular de la biblioteca jQuery permite la creación de poderosas páginas web dinámicas y aplicaciones web.
     • AJAX
       • AJAX, acrónimo de Asynchronous JavaScript And XML (JavaScript asíncrono y XML), es una técnica de desarrollo web para crear aplicaciones interactivas o RIA (Rich Internet Applications). Estas aplicaciones se ejecutan en el cliente, es decir, en el navegador de los usuarios mientras se mantiene la comunicación asíncrona con el servidor en segundo plano. De esta forma es posible realizar cambios sobre las páginas sin necesidad de recargarlas, mejorando la interactividad, velocidad y usabilidad en las aplicaciones.
       • Ajax es una tecnología asíncrona, en el sentido de que los datos adicionales se solicitan al servidor y se cargan en segundo plano sin interferir con la visualización ni el comportamiento de la página, aunque existe la posibilidad de configurar las peticiones como síncronas de tal forma que la interactividad de la página se detiene hasta la espera de la respuesta por parte del servidor.

2. Visión general

   • jQuery, en su núcleo, es una biblioteca de manipulación de Modelo de Objetos del Documento (DOM). El DOM es una representación en estructura de árbol de todos los elementos de una página web. JQuery simplifica la sintaxis para buscar, seleccionar y manipular estos elementos DOM. Por ejemplo, JQuery se puede usar para encontrar un elemento en el documento con una determinada propiedad (por ejemplo, todos los elementos con una etiqueta h1), cambiar uno o más de sus atributos (por ejemplo, color, visibilidad) o hacer que responda a un evento (por ejemplo, un clic del ratón).
   • jQuery también proporciona un paradigma para el manejo de eventos que va más allá de la selección y manipulación básicas de elementos DOM. La asignación de eventos y la definición de la función de devolución de llamada de eventos se realizan en un solo paso en una única ubicación en el código. JQuery también pretende incorporar otra funcionalidad de JavaScript muy utilizada (por ejemplo, entradas y salidas de fundido cuando se ocultan elementos, animaciones mediante la manipulación de las propiedades de CSS).

3. ¿Qué es el DOM?

   • Document Object Model o DOM ('Modelo de Objetos del Documento' o 'Modelo en Objetos para la Representación de Documentos') es esencialmente una interfaz de plataforma que proporciona un conjunto estándar de objetos para representar documentos HTML, XHTML y XML,1​ un modelo estándar sobre cómo pueden combinarse dichos objetos, y una interfaz estándar para acceder a ellos y manipularlos. A través del DOM, los programas pueden acceder y modificar el contenido, estructura y estilo de los documentos HTML y XML, que es para lo que se diseñó principalmente.
   • El responsable del DOM es el World Wide Web Consortium (W3C). El DOM permite el acceso dinámico a través de la programación para acceder, añadir y cambiar dinámicamente contenido estructurado en documentos con lenguajes como ECMAScript (JavaScript).
   • Historia del DOM
     • La historia del DOM está entrelazada con la historia de "la guerra de los navegadores" a finales de la década de 1990 entre Netscape Navigator y Microsoft Internet Explorer, así como con la de JavaScript y JScript, los primeros lenguajes de scripting que se implementaron ampliamente en los motores JavaScript de los navegadores web.
   • Establecer referencias a objetos
     • El DOM define la manera en que objetos y elementos se relacionan entre sí en el navegador y en el documento. Puede utilizarse cualquier lenguaje de programación adecuado para el diseño web. En el caso de JavaScript, cada objeto tiene un nombre, el cual es exclusivo y único. Cuando existe más de un objeto del mismo tipo en un documento web, estos se organizan en un vector. Es posible asignarle una identificación a un objeto, y luego usarla para hacer referencia a éste, por ejemplo: <div id="Juan">....</div>
       • Para hacer referencia a elementos del mismo tipo, los cuales, como se ha dicho, están organizados en un vector, se pueden utilizar la notación punto de la siguiente manera. document.div[0] document.div["Juan"] document.div.Juan
         • Donde el elemento «Juan» es el primero del vector de elementos del tipo <div>. También se puede usar la función getElementById. document.getElementById("Juan")