Leer parámetros desde la URL en JavaScript

Normalmente se suelen mandar parámetros desde un formulario en HTML / XHTML a un script escrito en un lenguaje de lado de servidor (JSP, PHP, ASP, …), pero en alguna ocasión tendremos que llamar a un HTML / XHTML pasándole parámetros por URL (es decir, los parámetros son enviados usando el método GET).

En JavaScript podemos recurrir al objeto del navegador location y a su método search. Si una URL con parámetros tiene la forma:

http://elbitcampeador.wordpress.com?parametro1=valor1&parametro2=valor2

Para esta URL, el método location.search devuelve la cadena:

?parametro1=valor1&parametro2=valor2

Donde cada parámetro está separado por el caracter &, y para cada párametro se usa el carácter = para separar el nombre del valor.

A continuación pongo un ejemplo completo de lectura de parámetros desde URL usando JavaScript, y usar dos parámetros en concreto (uno llamado ancho y otro alto) para hacer un recuadro con esas dimensiones.

index.html

   Leer parámetros desde JavaScript
<script type="text/javascript" src="script.js"></script>


 La URL es:
 El valor del parámetro ANCHO es:
 El valor del parámetro ALTO es:

script.js

function Init(){
	var url = String(window.location.href);
	var params = String(window.location.search);
	var aux1 = new Array();
	var aux2 = new Array();
	var cont = 0;
	var tot = 0;

	//si hay parametros
	if (params.length > 0){
		//eliminamos el primer caracter '?'
		params = params.substr(1);

		//insertamos en un array las parejas nombre=valor
		aux1 = params.split("&");
		tot = aux1.length;
		for (cont = 0; cont < tot; cont++){
			//separo el nombre del valor
			aux2 = aux1[cont].split("=");

			//trabajo con cada parámetro
			if (aux2[0].toLowerCase() == "ancho"){
				document.getElementById("ancho").innerHTML = aux2[1];
				document.getElementById("cuadro").style.width = aux2[1];
			}
			else if (aux2[0].toLowerCase() == "alto"){
				document.getElementById("alto").innerHTML = aux2[1];
				document.getElementById("cuadro").style.height = aux2[1];
			}

		}

	}
	else{
		alert("No hay parámetros en la URL");
	}

	document.getElementById("url").innerHTML = url;
}