jQuery, ¿una librería o un framework?
Desde siempre, sobre todo cuando trabajamos con el diseño web, es muy común, utilizar alguna herramienta que nos facilite muchas cosas, unas veces utilizamos un framework y otras una librería.
Por definición un framework es un entorno o marco (frame en español), de desarrollo, que siempre es muy estricto en cuanto a cómo se van a hacer las cosas, tomemos por ejemplo Bootstrap, el cuál es un framework, este te dice qué para hacer una página responsiva debes agregar clases específicas, usar contenedores específicos, y aunque existe una versión pre-compilada en less, que puedes configurar tú mismo, a veces es más sencillo simplemente ocupar el archivo ya compilado y olvidarte de modificarlo.
En cambio una librería es algo diferente, dígamos que este son un conjunto de funciones, como libros en una biblioteca, que podemos ocupar en cualquier momento de acuerdo a nuestras necesidades, es cierto que necesitan una serie de parámetros obligatorios y otros opcionales y que tal vez nos devuelvan un resultado, pero si por ejemplo nosotros contruimos una función propia que gestione mucho mejor los resultados y nos devuelva sólo el valor que nosotros queramos, la operación de la librería no nos serviría y simplemente no la usaríamos, pero eso no significa que la librería no funcione en su totalidad en nuestra página, es como cuando vamos a una biblioteca y solamente necesitamos el libro de física y nos olvidamos de la sección de historia (si seguimos la anología anterior).
Entonces por definición de términos podríamos decir que jQuery es una librería, ya que no provee diferentes funciones que no permiten hacer muchas cosas, desde manipulación del DOM, hasta peticiones AJAX, y todo eso por el mismo costo, un sólo archivo que contiene todas estás funciones, y si no hay una función que se apegue a tus necesidades, puedes crear una propia o agregarséla a jQuery como un plugin, que su configuración es demasiado sencilla, y quizá esa sea la razón por la cual muchos frameworks la utilizan, sobre todo Bootstrap, Materialize (aunque en la versión 1.0, que aún está en beta, ya no y un par más de Diseño y Responsividad Web.
$.ajax()
Funciones y Métodos imprecindibles en jQuery qué puedes usar
Los siguientes métodos y funciones de jQuery puedes checarlos completos en la documentación de jQuery, por supuesto en inglés.$.ajax()
Está es una función muy importante si constantemente necesitas enviar peticiones AJAX, es altamente configurable y puede ser llamada de distintas formas:
- $.ajax(url, settings)
accepts: Otro objeto tipo plano JSON para crear un tipo de respuesta del servidor que no se encuentra disponible en el navegador por defecto, depende de los dataTypes seteados en el mismo objeto settings de jQuery para AJAX
dataTypes: Son los tipos de MIME que pueden ser recibidos del servidor.
converters: Es un objeto tipo JSON que contiene las instrucciones necesarias para deserializar los objetos recibidos de cada dataTypes definido.
async: Define si la petición va a ser Asicrónica o no, recibe un parámetro booleano y por default es true.
beforeSend: Este parámetro debe ser definido como una función y se executa inmediatamente antes de enviar la petición, y si se requiere ser cancelada simplemente debe retornarse false.
cache: Este también es un atributo booleano y se refiere a si se debe mantener los datos de la respuesta en el navegador, y por default está seteado a true.
complete: Está es una función callback y se executa en cuanto la petición a terminado, aunque la petición haya fallado y el servidor no responda se ejecuta, y el callback recibe cómo parámetros dos argumentos, el XMLHTTPREQUEST y un string con el estado de la petición.
contentType: Este parámetro define el header HTTP del mismo nombre. Es un string
data: Este parámetro recibe los datos que se van a enviar al servidor, es un objeto JSON y cada parámetros toma el nombre de su clave en el objeto por ejemplo {"content": "Contenido del archivo..."}, esto nos generaría, content=Contenido+del+archivo
method: Este parámetro define el tipo de petición que se enviará al servidor, por default está en GET pero se puede usar POST, o PUT.
Si crees que son demasiadas cosas que configurar, no tienes de que preocuparte, jQuery tiene los métodos $.post() y $.get() que son funciones preconfiguradas para hacer peticiones POST y GET, respectivamente, ambas reciben un objeto JSON donde tú sólo tendrías que poner la url, data, y complete, sin configurar los demás.
$(element).animate()
Está función es muy útil para hacer animaciones con las propiedades css, esté método recibe 1 parámetro requerido y los demás opcionales:
properties: Este es el parámetro requerido, es un objeto JSON con todas las propiedades css para animar, aunque la mayoría de las propiedades son animables, no se pueden animar todas, así que hay que tener mucho cuidado con lo que se anima, entre las animables se encuentran, la altura, a anchura, el color, el grosor de los bordes, la opacidad, etc.
duration: Define la duración de la animación y debe ser determinado en milisegundos, por default es de 400
easing: Es un string difiniendo el tipo de animación que se usará en la transición, por default se encuentra seteado en "swing", pero se puede usar "fadeOut", "fadeIn" y un par más presentes en la documentación.
complete: Este parámetro es una función callback que se ejecuta cuando la animación a terminado, y se ejecuta por cada elemento seleccionado.
$(element).attr(attributeName[, value])
Esté método es muy útil para obtener o modificar atributos de un elemento del DOM, el primer argumento el nombre del atributo y el segundo el nuevo valor, y aunque no se define el valor, esté retorna el valor del atributo.
$.Event(nameEven[, optsEvent])
Está propiedad puede crear un evento y agregarle el nombre que se le pase por parámetro, además de el siguiente parámetro opcional que le asigna las propiedades si el evento acepta propiedades.
El evento que crea, es un evento jQuery, lo crea a partir del evento estándar del W3C. y si se quiere acceder a este, se encuentra en la propiedad originalEvent del objeto que retorna.
dataTypes: Son los tipos de MIME que pueden ser recibidos del servidor.
converters: Es un objeto tipo JSON que contiene las instrucciones necesarias para deserializar los objetos recibidos de cada dataTypes definido.
async: Define si la petición va a ser Asicrónica o no, recibe un parámetro booleano y por default es true.
beforeSend: Este parámetro debe ser definido como una función y se executa inmediatamente antes de enviar la petición, y si se requiere ser cancelada simplemente debe retornarse false.
cache: Este también es un atributo booleano y se refiere a si se debe mantener los datos de la respuesta en el navegador, y por default está seteado a true.
complete: Está es una función callback y se executa en cuanto la petición a terminado, aunque la petición haya fallado y el servidor no responda se ejecuta, y el callback recibe cómo parámetros dos argumentos, el XMLHTTPREQUEST y un string con el estado de la petición.
contentType: Este parámetro define el header HTTP del mismo nombre. Es un string
data: Este parámetro recibe los datos que se van a enviar al servidor, es un objeto JSON y cada parámetros toma el nombre de su clave en el objeto por ejemplo {"content": "Contenido del archivo..."}, esto nos generaría, content=Contenido+del+archivo
method: Este parámetro define el tipo de petición que se enviará al servidor, por default está en GET pero se puede usar POST, o PUT.
Si crees que son demasiadas cosas que configurar, no tienes de que preocuparte, jQuery tiene los métodos $.post() y $.get() que son funciones preconfiguradas para hacer peticiones POST y GET, respectivamente, ambas reciben un objeto JSON donde tú sólo tendrías que poner la url, data, y complete, sin configurar los demás.
$(element).animate()
Está función es muy útil para hacer animaciones con las propiedades css, esté método recibe 1 parámetro requerido y los demás opcionales:
- $.animate(propierties[, duration, easing, complete])
properties: Este es el parámetro requerido, es un objeto JSON con todas las propiedades css para animar, aunque la mayoría de las propiedades son animables, no se pueden animar todas, así que hay que tener mucho cuidado con lo que se anima, entre las animables se encuentran, la altura, a anchura, el color, el grosor de los bordes, la opacidad, etc.
duration: Define la duración de la animación y debe ser determinado en milisegundos, por default es de 400
easing: Es un string difiniendo el tipo de animación que se usará en la transición, por default se encuentra seteado en "swing", pero se puede usar "fadeOut", "fadeIn" y un par más presentes en la documentación.
complete: Este parámetro es una función callback que se ejecuta cuando la animación a terminado, y se ejecuta por cada elemento seleccionado.
$(element).attr(attributeName[, value])
Esté método es muy útil para obtener o modificar atributos de un elemento del DOM, el primer argumento el nombre del atributo y el segundo el nuevo valor, y aunque no se define el valor, esté retorna el valor del atributo.
$.Event(nameEven[, optsEvent])
Está propiedad puede crear un evento y agregarle el nombre que se le pase por parámetro, además de el siguiente parámetro opcional que le asigna las propiedades si el evento acepta propiedades.
El evento que crea, es un evento jQuery, lo crea a partir del evento estándar del W3C. y si se quiere acceder a este, se encuentra en la propiedad originalEvent del objeto que retorna.
Comentarios
Publicar un comentario