Utilizando jQuery podemos encontrarnos en la situación de no saber detectar que la página está cargada, o el DOM.

¿Cuándo utilizar $(document).ready()?

	$( document ).ready(function() {
		console.log("El DOM está listo");
	});

Según la documentación oficial de la librería jQuery, se utilizará esta forma para detectar que se ha cargado el Modelo de Objetos del Documento (DOM). A partir de aquí, podremos manipular la página sin riesgo de errores, más allá de los propios de nuestro código.

¿Cuándo utilizar $(window).on(«load»)?

	$(window).on( "load", function() {
		console.log( "Todos los elementos de la página se han cargado" );
	});

El código incluído aquí se ejecutará cuando todos los elementos de la página estén listos, no sólo el DOM. Esto incluye, por ejemplo, imágenes e iframes.

Diferencia entre $(document).ready() y $(window).on(«load»)

La diferencia viene indicada en el mismo nombre de cada método:

document: cuando esté listo sólo el documento, DOM.
window: cuando está lista toda la ventana, el documento y todo lo demás.

Más información

A partir de jQuery 3.0, $(document).ready() pasa al estado Deprecated. Esto significa que seguirá funcionando, pero en la próxima versión de jQuery, la 4, desaparecerá. En su lugar, se deberá utilizar, por ejemplo, la siguiente forma propuesta:

	$(function(){
		console.log("El DOM está listo");
	});