[jQuery-es] ¿Como implementa jQuery ready?

Choan Gálvez choan.galvez en gmail.com
Lun Mayo 14 02:01:58 PDT 2007


Hola.

On 13/05/2007, at 14:51, stripTM wrote:

> Estoy mirando como hace para implementar jQuery el evento ready,  
> pero no
> lo tengo claro, ya que parece que la primera vez que lo llamas deja el
> atributo isReady a true, y no le encuentro relación con la  
> finalización
> de la carga del documento.
>
>
>
> jQuery.extend({
> 	/*
> 	 * All the code that makes DOM Ready work nicely.
> 	 */
> 	isReady: false,
> 	readyList: [],
> 	
> 	// Handle when the DOM is ready
> 	ready: function() {
> 		// Make sure that the DOM is not already loaded
> 		if ( !jQuery.isReady ) {
> 			// Remember that the DOM is ready
> 			jQuery.isReady = true;
> 			
> 			// If there are functions bound, to execute
> 			if ( jQuery.readyList ) {
> 				// Execute all of them
> 				jQuery.each( jQuery.readyList, function(){
> 					this.apply( document );
> 				});
> 				
> 				// Reset the list of functions
> 				jQuery.readyList = null;
> 			}
> 			// Remove event lisenter to avoid memory leak
> 			if ( jQuery.browser.mozilla || jQuery.browser.opera )
> 				document.removeEventListener( "DOMContentLoaded", jQuery.ready,  
> false );
> 		}
> 	}
> });


El código relativo a `ready` está dividido en tres secciones. La que  
tú has copiado es la que se encarga de ejecutar la lista de funciones  
asignadas al "evento". He aquí la que se encarga de añadirlas  
(corresponde a $.fn.ready):

	ready: function(f) {
		// If the DOM is already ready
		if ( jQuery.isReady )
			// Execute the function immediately
			f.apply( document, [jQuery] );
			
		// Otherwise, remember the function for later
		else {
			// Add the function to the wait list
			jQuery.readyList.push( function() { return f.apply(this,  
[jQuery]) } );
		}
	
		return this;
	}


El código que se encarga de llamar a `$.ready`(la primera que habías  
pegado) es este:

	// If Mozilla is used
	if ( jQuery.browser.mozilla || jQuery.browser.opera )
		// Use the handy event callback
		document.addEventListener( "DOMContentLoaded", jQuery.ready, false );
	
	// If IE is used, use the excellent hack by Matthias Miller
	// http://www.outofhanwell.com/blog/index.php? 
title=the_window_onload_problem_revisited
	else if ( jQuery.browser.msie ) {
	
		// Only works if you document.write() it
		document.write("<scr" + "ipt id=__ie_init defer=true " +
			"src=//:><\/script>");
	
		// Use the defer script hack
		var script = document.getElementById("__ie_init");
		
		// script does not exist if jQuery is loaded dynamically
		if ( script )
			script.onreadystatechange = function() {
				if ( this.readyState != "complete" ) return;
				jQuery.ready();
			};
	
		// Clear from memory
		script = null;
	
	// If Safari  is used
	} else if ( jQuery.browser.safari )
		// Continually check to see if the document.readyState is valid
		jQuery.safariTimer = setInterval(function(){
			// loaded and complete are both valid states
			if ( document.readyState == "loaded" ||
				document.readyState == "complete" ) {
	
				// If either one are found, remove the timer
				clearInterval( jQuery.safariTimer );
				jQuery.safariTimer = null;
	
				// and execute any waiting functions
				jQuery.ready();
			}
		}, 10);

	// A fallback to window.onload, that will always work
	jQuery.event.add( window, "load", jQuery.ready );


Traduzco: si se usa Opera o Firefox, se asigna `jQuery.ready` como  
manejador del evento `DOMContentLoaded`. Si se usa IE, se aplica un  
sucio hack (se genera un elemento `script` mediante `document.write`  
y bla bla). Si se trata de Safari, se usa un temporizador.

Y, por si todo lo anterior fallase, se asigna también `jQuery.ready`  
como manejador del evento `window.onload`.

¿Iba por aquí lo que querías averiguar?

Un saludo.
-- 
Choan Gálvez
<choan.galvez en gmail.com>
<http://choangalvez.nom.es/>





Más información sobre la lista de distribución jquery-es