jQuery es un framework de JavaScript que la mayoría de los desarrolladores web(incluyéndome) utilizan. Pero ¿Por qué lo utilizan?. Es simple la respuesta, es mas fácil codificar esto: " var iD = $('input[name=id]').val; " que esto "var iD = document.getElementByName("id").value; ", ¿Cuál es mas fácil de programar y mas aun de comprender el código con facilidad?. Obviamente seria jQuery por la facilidad de su sintaxis pero dirán que si jQuery sustituye a JavaScript y la respuesta es no, jQuery facilita la codificación en JS la cual es muy complicada y poco entendible. Un plus para jQuery es la manejo simple de DOM, como eventos, efectos y funciones las cuales en JS es muy complicado, un ejemplo universal seria el de AJAX(Asynchronous JavaScript and XML) una serie de funciones y comandos en JS que en jQuery lo haces con una función y unos ciertos parámetros configurables.

¿Qué necesito para utilizar jQuery en mi proyecto?. Lo primero antes de todo es conocer JavaScript y DOM, si no tienes alguna experiencia o un conocimiento previo, seria un poco mas difícil entender su funcionamiento pero si eres alguien autodidacta no se dificultara en absoluto. Regresando a la pregunta, necesitas el archivo .js de jQuery lo puedes descargar de su pagina oficial jquery(Liga) o puedes hacer un "Request" al repositorio de jQuery y así disminuir el tiempo de carga de tu proyecto.

Estructura Basica de una pagina HTML con jQuery.

codigojquery01

Como inicializar jQuery?:

1.- "http://code.jquery.com/jquery-latest.min.js", esa liga es directamente para hacer el request al repositorio de jQuery, como lo mencione anteriormente, lo puedes descargar desde la pagina de jQuery.

2.- "$(document).ready(function (){});", esta linea de codigo es jQuery, lo que hace esta linea es decirle a jQuery que ejecute lo que esta adentro de ella hasta que TERMINE de cargar la pagina completa(imagenes,archivos,ligas,etc).

3.- Al cargar el HTML completo jQuery con "$('#button').click(function(){});" agrega a el id button un evento llamado click, el cual se ejecuta hasta que el objeto con el id fuese "clickeado".

4.- Cuando el objeto con el id button es clickeado, se ejecuta otro evento "$('ul').append('<li>Hola!</li>');", en esta linea lo que se ejecuta es, primero identifica todos los elementos en el HTML con el tag <ul>, enseguida con el evento "append" lo que hace es agrega al final del tag(antes de </ul>) este string "<li>Hola!</li>".

codigojquery02

Como sabe jQuery que objeto seleccionar?:

Para seleccionar un objeto del HTML es necesario: "$()", adentro de los parentesis se escribe el selector que puede ser por, Tag, Id, Name, Type, Class, etc. Para el Tag solo se escribe $("input"), lo que hace jQuery es seleccionar todos los tags que sean input en HTML, para el Id es mas simple(porque no puede haber 2 tags con el mismo id, esto lo hace unico) y el mas utilizado $("#Id"), jQuery selecciona unicamente el elemento con ese id, para seleccionar por nombre es un poco mas complicado porque es un poco mas de caracteres y los nombres raramente son unicos, $("input[name=input]"). para mas informacion en el API de jQuery.

codigojquery03

Encuesta de Hoy

Qué gadget te gustaria tener?

Acerca de: MG

Es un proyecto sobre un sitio web, donde los usuarios podrán leer noticias y artículos de relevancia sobre todo lo que envuelve a la Tecnología; Escritos por profesionales en los ramos de Diseño Web, Programacion Web, TI, etc.

Leer más...

MundoGeek

Comentarios y Sugerencias por favor a: contactoarroba_1mundogeek.com, Gracias por tu preferencia.

Login Form