0
(0)
A continuación encontrarás una breve recopilación de unos pequeños códigos en javascript. Con ellos podrás obtener la URL de la página actual o parte de la misma. 

Y es que,… a veces no necesitamos la URL completa, pero si podríamos requerir ciertas partes, tales como el  dominio, la ruta, el hash, etc. 

De tal modo, al menos se hará referencia de aquellas comúnmente utilizadas. 

En ciertos ejemplos, solo con fines demostrativos para que se muestre el resultado, se ha estimado incluir la instrucción alert( ).  

Además, recuerda que deben ser incluidos dentro de las etiquetas <script> … </script>

 

Obtener la URL de la página actual completa

La URL actual es toda la dirección que generalmente podemos ver en la barra de direcciones del navegador. Se la puede obtener mediante este código:
var URLactual = window.location;
alert(URLactual);

Como vemos, en la variable URLactual, se almacena el valor obtenido usando window.location; que tal como su nombre indica, es la localización del documento actual. 

Por ejemplo, si la URL que vemos en la barra de direcciones es:

http://elsitio.com/folder/pagina.html?key=value#1234 

La localización o URL de la página actual es toda la cadena http://elsitio.com/folder/pagina.html?key=value#1234.

 

Así, observarás que se incluye:

  • el protocolo y dominio (http://elsitio.com)
  • la ruta o pathname (/folder/pagina.html)
  • el query string (?key=value)
  • y el identificador de fragmento (#1234)

 

Entonces, puede decirse que window.location prácticamente sería sinónimo de window.location.href. De tal modo que con este código se obtendría el mismo resultado:

var URLactual = window.location.href;
alert(URLactual);

 

Utilizando jQuery se puede obtener con:

var URLactual = jQuery(location).attr(‘href’);

 

Obtener la ruta absoluta

Empleando la siguiente función podemos obtener la ruta absoluta (absolute
path) que incluye el dominio y el pathname:

function getAbsolutePath() {
    var loc = window.location;
    var pathName = loc.pathname.substring(0, loc.pathname.lastIndexOf('/') + 1);
    return loc.href.substring(0, loc.href.length - ((loc.pathname + loc.search + loc.hash).length - pathName.length));
}
alert (getAbsolutePath());

 

Por ejemplo, si tenemos la URL http://elsitio.com/folder/pagina.html,
la ruta absoluta es http://elsitio.com/folder/
 
 

Obtener solo la ruta (pathname)

El objeto window.location tiene más propiedades. Entre ellas, si queremos
obtener sólo el pathname (ruta) de la URL, podemos usar:
var pathname = window.location.pathname;
alert(pathname);

 

Por ejemplo, si tenemos http://elsitio.com/folder/pagina.html,
el pathname es /folder/pagina.html
 
De tal modo, el pathname no incluye el query string ni el identificador de fragmento, siendo el caso de que lo hubiera.
 
 

Obtener el protocolo

Si necesitamos saber el protocolo utilizaremos window.location.protocol.
Así:
var URLprotocolo = window.location.protocol;
alert(URLprotocolo);
 
De tal manera, esto nos devolverá http: o https: según sea el caso.
 
 

Obtener el dominio

Para obtener solamente el dominio de la url actual, podemos emplear el
atributo host de window.location, tal como sigue:
var URLdominio = window.location.host;
alert(URLdominio);
 
Por ejemplo, si tenemos la url http://elsitio.com/folder/pagina.html
el dominio es elsitio.com
Fíjate que no se incluye el protocolo (en este caso http:). 
 
 

Obtener el hash o identificador de fragmento

Si deseamos obtener solo el hash de la URL:
var URLhash = window.location.hash;
alert(URLhash);
 
Por ejemplo, si tenemos http://elsitio.com/folder/pagina.html#fama
obtenemos el hash #fama
 
 

Obtener el query string

Si lo que queremos es obtener el query string de la URL actual (conocido también como search), podemos recurrir a:
var URLsearch = window.location.search;
alert(URLsearch);

Por ejemplo, si tenemos la url http://elsitio.com/folder/pagina.html?key=value#fama 
el query string es ?key=value.

 

NOTA: El objeto window.location tiene más propiedades que pueden resultarte muy útiles. Si deseas ver una lista completa, puedes visitar esta página de Mozilla Developer.

 

Espero que esta breve recopilación de códigos para obtener la url de la página actual o sus partes, haya sido lo que andabas buscando. Sobre todo que te resulte útil para lo que requieres hacer.

 

Quizás te interese:

 

 

Vicente Ramírez Administrator

Me encantan los blogs y todo lo que se puede aprender con ellos.
Me desempeñé como profesor de sistemas informáticos unos años de mi vida. Estudios de Licenciatura en Publicidad y Marketing. Tnlgo. en Sistemas de Computación, enseñando lo poco o mucho que puedo saber y ahora con gusto lo comparto con ustedes.

follow me
Vicente Ramírez

Soy autor y fundador de este sitio. Me encantan los blogs y todo lo que se puede aprender con ellos.

Unos años de mi vida me desempeñé como técnico en una empresa de telecomunicaciones y otros como profesor de sistemas informáticos, enseñando lo poco o mucho que puedo saber y ahora lo comparto con ustedes.

En casa, no le huyo a preparar recetas de cocina, sobre todo si se trata de compartir la mesa con mis hijos. Me gusta  también ver la vida en el proceso de las plantas y el respeto a los animales.

Tengo estudios formales de Tecnología en Sistemas de Computación y Licenciatura en Publicidad y Marketing.  Aunque sobre varias  temáticas me gusta ser autodidacta y experimentar para obtener resultados que pueda compartir de manera confiable.

Sin embargo, respecto a mi formación, regularmente evito me llamen por título y simplemente soy Vicente Ramírez, un instructor, un papá, un amigo.  Y es que en ocasiones he escuchado cuando a alguien le preguntan por su nombre y responde… Mi nombre es “Ingeniero Juan Pérez” o “Master Ana Piguave”, por lo que me pregunto si sus padres le habrán puesto por nombre “Ingeniero” o “Master” (😃 Je, je, je, una cosa es el nombre, otra cosa es la profesión). 

Realmente me apasiona el emprendimiento combinado con la tecnología, por lo que me he dado impulso para gestionar con mi proyecto web actual, plasmando este blog en el que se incluyen varias temáticas.

Así, esta web nace con la vocación de ser un sitio para compartir y divulgar estos conocimientos combinados con el de otros autores que poco a poco se van integrando.

 

¿De cuánta utilidad te ha parecido este contenido?

¡Haz clic en una estrella para puntuarlo!

Promedio de puntuación 0 / 5. Recuento de votos: 0

Hasta ahora, ¡no hay votos!. Sé el primero en puntuar este contenido.

Deja una respuesta