Cómo redirigir a una URL relativa en JavaScript?

La redirección de un usuario a diferentes páginas web en función de sus acciones es esencial para aprender en JavaScript. Sin embargo, los nuevos principiantes a menudo confunden la redirección a un Url y redirigir a una URL relativa. Sin embargo, el proceso de redireccionamiento no es diferente en absoluto, pero el significado de los términos es bastante diferente.

Redirigir a una URL normal significa enviar al usuario a una URL sin importar cuál sea esa URL o dónde se coloca. Dirigir a una URL relativa significa redirigir al usuario a una página web colocada en el mismo directorio que la página principal o la página de inicio. Las URL relativas también se pueden usar para redirigir a los archivos colocados en otros directorios, pero la URL relativa contendría solo la ruta y ninguna otra información como el dominio.

Este artículo explicará dos métodos diferentes para redirigir a los usuarios a URL relativas, pero antes de eso, configure rápidamente dos páginas web diferentes utilizando los pasos a continuación:

Configuración de los dos documentos HTML

Crear un nuevo documento HTML llamado hogar Y coloque las siguientes líneas dentro de él:

Esta es la primera página!
Haz click en mi!

Esto mostrará la siguiente página web en el navegador:

Después de eso, cree otro documento HTML en el mismo directorio (Esto es importante convertirlo en una URL relativa) y nombrarla como segunda pagina.html. Después de eso, escriba las siguientes líneas en la segunda página.HTML:

Esta es la segunda página



Estoy en el mismo directorio que en casa.html

Ejecutando la segunda página.HTML en el navegador web ofrece el siguiente resultado:

Configurar las páginas web está lista. Pasemos a los dos métodos diferentes para la redirección de URL relativa.

Método 1: Uso del objeto de ventana para redirigir a una URL relativa

En el archivo de script adjunto a la casa.Página web HTML, cree la siguiente función:

función buttonclicked ()
// Las siguientes líneas entran en este cuerpo

Dentro de esta función, usa el ventana OBJETO para acceder a su propiedad de ubicación, y desde ese acceso el href y igual a la ruta de la segunda página.html. Dado que es una URL relativa (ambas páginas web están en el mismo directorio), simplemente establezca el href en el nombre de la segunda página web, que es segunda pagina.html. La función se verá así:

función buttonclicked ()
ventana.ubicación.href = "segunda página.html ";

Corre la casa.html en un navegador web y luego observe la siguiente funcionalidad:

Desde la salida, está claro que presionar el botón redirige al usuario a la segunda página.HTML usando su URL relativa

Método 2: Uso del objeto de documento para redirigir a una URL relativa

Comience nuevamente creando la función creada en el método 1 con las siguientes líneas:

función buttonclicked ()
// Las siguientes líneas entran en este cuerpo

En esta función, en lugar del objeto de la ventana, esta vez utilizando el objeto de documento para acceder al objeto de ubicación. Y luego, desde el objeto de ubicación, acceda a la propiedad href y configúrela igual a la ruta relativa de la segunda página.html. Desde el segunda pagina está en el mismo directorio, la ruta relativa solo sería el nombre de la segunda página web, que es la "segunda página.html "

función buttonclicked ()
documento.ubicación.href = "segunda página.html ";

Corre la casa.html en un navegador web y luego observe la siguiente funcionalidad:

Está claro que el usuario fue redirigido al segundo utilizando el pariente de la segunda página con la ayuda de JavaScript.

Envolver

El usuario puede ser redirigido a otra página web con la ayuda de una URL relativa utilizando el documento.ubicación.href propiedad o el ventana.ubicación.href propiedad y establecer su valor igual a la URL relativa de la segunda página web. En este artículo, ambos métodos se demostraron con la ayuda de un ejemplo paso a paso.