Si miras una URL el fina de esta puede contener una palabra separada por un símbolo de almohadilla (#). Esto es lo que se conoce como elemento hash de la URL y nos sirve para posicionarnos dentro de una parte determinada de la página. Esto lo conseguimos de forma sencilla mediante HTML.
La URL miweb.html#elemento se va a posicionar en la página allí dónde utilicemos el siguiente código:
Si quieres más información al respecto puedes leer el artículo Enlace a una parte concreta de la página el cual te resolverá todas tus dudas.
Pero, ¿cómo podemos acceder al hash de la URL con Javascript? Es decir, qué hacer si queremos controlar cuando el usuario llegue con una URL que contenga una etiqueta o elemento de hash.
La solución es bastante sencilla y es que en Javascript tenemos el objeto location, el cual hace referencia a la URL que maneja el navegador, este objeto nos va a facilitar acceder al hash de la URL con Javascript.
location
En concreto tenemos una propiedad del objeto location llamada .hash (el nombre que ni pintado) que nos devuelve el hash de la URL.
//Volvar el hash a la consola
console.log(location.hash;)
Como podemos ver, el uso de la propiedad location.hash nos facilita el acceso al hash de la URL con Javascript. Eso sí, solo tenemos que tener cuidado con una cosa, y es que no nos devuelve el elemento correspondiente con el hash, si no que nos devuelve el elemento precedido de la almohadilla.
Así de la URL
https://lineadecodigo.com/#acerca-de
El objeto location.hash nos devolverá:
#acerca-de
Ahora ya solo queda decidir qué hacer con el hash. Por ejemplo mostrar un contenido u otro, mostrar una pestaña u otra,… ¿qué más casos se te ocurren para utilizar la propiedad hash en Javascript?
