Embed Size (px)
DESCRIPTION
dd
Citation preview
Iniciar un script jQuery
Una vez que el framework se ha configurado y está preparado para utilizarse, es preciso, antes que
nada, examinar algunas nociones teóricas.
Todas las instrucciones o, para ser más precisos, todos los scripts jQuery, se articulan alrededor de
un modelo único. Éste es:
jQuery(function(){ //contenido que se ejecuta cuando se carga el documento });
Para ahorrar pulsaciones del teclado, se utiliza casi siempre el signo dólar ($), que funciona como alias
de jQuery.
$(function(){ //contenido externo que se ejecuta cuando se cargue el documento });
Haciendo referencia a este modelo, todo script jQuery empieza por:
<script> $(document).ready(function() { // código jQuery }); </script>
Es decir, crear un objeto jQuery ($) a partir del documento (document), cuando esté preparado
(ready).
La particularidad de esta función es que carga los elementos del DOM tan pronto como estén
disponibles, es decir, antes de la carga completa de la página.
Esta función de jQuery le diferencia del JavaScript clásico. Por ejemplo, éste usa el
clásicowindow.onload = function(), que espera a que la página y todos los elementos que
contiene estén completamente cargados. Esto puede ser muy largo, especialmente cuando hay
imágenes con un tamaño importante. Es una particularidad esencial de jQuery que se basa,
recordemos, de manera nativa en los elementos del DOM.
Este modo de funcionamiento presenta muchas ventajas:
Todos los elementos de la página están incluidos en un objeto que los selectores, los métodos
y las funciones de jQuery pueden manejar.
El código Html está desprovisto de cualquier mención JavaScript, como por ejemplo las
notaciones <a href="javascript:void(0);">enlace </a>. Todo el código
JavaScript/jQuery se sitúa en una parte separada de la página Html (entre las
etiquetas<head>...</head>) o en un archivo js externo, lo que respeta completamente el
principio de separación del contenido y de la presentación.
Con $(document).ready(), los elementos de la página están a disposición del desarrollador, antes
de la carga completa y su visualización. Esto es muy práctico para activar los efectos del navegador
de aparición o desaparición de la página.
En la Web se encuentran scripts jQuery que comienzan con la escritura abreviada:
$(function () { // código jQuery });
A lo largo del libro, vamos a adoptar la instrucción $(document).ready(), más académica y
expresiva.
El signo $ también es usado por otros frameworks, como por ejemplo Prototype. El
métodojquery.noconflict (ver el capítulo Algunas utilidades - Evitar los conflictos) permite
evitar los conflictos en la llamada del alias $ con otra librería que también use esta nomenclatura
para una de sus funciones.
