Como redirecionar para um URL relativo em JavaScript?

Redirecionar um usuário para diferentes páginas da web com base em suas ações é essencial para aprender no JavaScript. No entanto, novos iniciantes frequentemente confundem redirecionando para um Url e redirecionando para um URL relativo. No entanto, o processo de redirecionamento não é diferente, mas o significado dos termos é bem diferente.

Redirecionar para um URL normal significa enviar o usuário a um URL, não importa o que seja esse URL ou onde é colocado. Direcionar para um URL relativo significa redirecionar o usuário para uma página da web colocada no mesmo diretório que a página pai ou a página inicial. URLs relativos também podem ser usados ​​para redirecionar para arquivos colocados em outros diretórios, mas o URL relativo continha apenas o caminho e nenhuma outra informação como o domínio.

Este artigo explicará dois métodos diferentes para redirecionar os usuários para URLs relativos, mas antes disso, configurará rapidamente duas páginas da Web diferentes usando as etapas abaixo:

Configurando os dois documentos HTML

Crie um novo documento HTML nomeado lar e coloque as seguintes linhas dentro dele:

Esta é a primeira página!
Clique em mim!

Isso exibirá a seguinte página da web no navegador:

Depois disso, crie outro documento HTML no mesmo diretório (Isso é importante para torná -lo um URL relativo) e nomear como SecondPage.html. Depois disso, digite as seguintes linhas na segunda página.html:

Esta é a segunda página



Estou no mesmo diretório que casa.html

Executando a segunda página.HTML no navegador da web fornece o seguinte resultado:

Configurando as páginas da web é feito. Vamos passar para os dois métodos diferentes para o redirecionamento de URL relativo.

Método 1: Usando o objeto da janela para redirecionar para um URL relativo

No arquivo de script anexado à casa.página da web html, crie a seguinte função:

função buttonClicked ()
// as próximas linhas entram dentro deste corpo

Dentro desta função, use o janela Objeta para acessar sua propriedade de localização e a partir desse acesso ao HREF e igual ao caminho da segunda página.html. Como é um URL relativo (as duas páginas da web estão no mesmo diretório), basta definir o href como o nome da segunda página da web, que é SecondPage.html. A função ficará assim:

função buttonClicked ()
janela.localização.href = "SecondPage.html ";

Execute a casa.HTML em um navegador da web e depois observe a seguinte funcionalidade:

Da saída, fica claro que pressionar o botão redireciona o usuário para a segunda página.HTML usando seu URL relativo

Método 2: Usando o objeto de documento para redirecionar para um URL relativo

Comece novamente criando novamente a função criada no método 1 com as seguintes linhas:

função buttonClicked ()
// as próximas linhas entram dentro deste corpo

Nesta função, em vez do objeto da janela, desta vez usando o objeto Document para acessar o objeto de localização. E então, a partir do objeto de localização, acesse a propriedade HREF e defina -o igual ao caminho relativo da segunda página.html. Desde o SecondPage está no mesmo diretório, o caminho relativo seria apenas o nome da segunda página da web, que é a “segunda página.html ”

função buttonClicked ()
documento.localização.href = "SecondPage.html ";

Execute a casa.HTML em um navegador da web e depois observe a seguinte funcionalidade:

É claro que o usuário foi redirecionado para o segundo usando o parente da segunda página com a ajuda do JavaScript.

Embrulhar

O usuário pode ser redirecionado para outra página da web com a ajuda de um URL relativo usando o documento.localização.Href propriedade ou o janela.localização.Href propriedade e definindo seu valor igual ao URL relativo da segunda página da web. Neste artigo, esses dois métodos foram demonstrados com a ajuda de um exemplo passo a passo.