Métodos window.location.href e window.open () em JavaScript

271

Qual é a diferença entre window.location.hrefe window.open ()métodos em JavaScript?

— masif
fonte

2

Relacionado: Como redirecionar para outra página da Web

— krubo 20/10/19

511

window.location.hrefnão é um método, é uma propriedade que informa a localização atual do URL do navegador. Alterar o valor da propriedade redirecionará a página.

window.open()é um método para o qual você pode passar um URL para o qual deseja abrir em uma nova janela. Por exemplo:

exemplo window.location.href:

window.location.href = 'http://www.google.com'; //Will take you to Google.

exemplo window.open ():

window.open('http://www.google.com'); //This will open Google in a new window.

Informação adicional:

window.open()podem ser passados parâmetros adicionais. Consulte o tutorial : window.open

— James Hill
fonte

5

O padrão provavelmente diz que window.location.hrefé uma propriedade, não um método, mas o Internet Explorer (pelo menos na versão 10) também permite que você trate hrefcomo método. Eu já vi isso funcionar, apenas no IE10, em uma página que usei. Provavelmente é por isso que o solicitante estava chamando hrefum método. Veja a questão IE incompatibilidade com window.location.href . Mas sim, é melhor usar hrefcomo uma propriedade, que funcionará em qualquer navegador, incluindo o IE .

— Rory O'Kane

5

@ RoryO'Kane, esta pergunta foi feita em 2011. Eu duvido que o usuário estava se referindo ao IE 10.

— James Hill

9

Verdade. Mas acho que é provável, embora não seja certo, que as versões mais antigas do IE tratassem window.location.hrefda mesma maneira. Afinal, as versões mais recentes do iE geralmente estão ficando mais baseadas em padrões, e não menos. Portanto, se o IE10 ainda está quebrando o padrão, as versões mais antigas provavelmente também o fizeram.

— Rory O'Kane

32

window.open abrirá um novo navegador com o URL especificado.
window.location.href abrirá o URL na janela em que o código é chamado.

Observe também que window.open()é uma função no objeto da janela, enquanto window.locationé um objeto que expõe uma variedade de outros métodos e propriedades .

— Tom
fonte

14

window.open é um método; você pode abrir uma nova janela e personalizá-la. window.location.href é apenas uma propriedade da janela atual.

— ngi
fonte

12

Já existem respostas que descrevem a propriedade window.location.href e o método window.open () .

Eu irei por uso objetivo:

1. Para redirecionar a página para outra

Use window.location.href. Defina a propriedade href como href de outra página.

2. Abra o link na janela nova ou específica.

Use window.open (). Passe parâmetros de acordo com seu objetivo.

3. Conheça o endereço atual da página

Use window.location.href. Obtenha o valor da propriedade window.location.href. Você também pode obter um protocolo específico, nome do host e hashstring no objeto window.location.

Consulte Objeto de localização para obter mais informações.

— Somnath Muluk
fonte

9

window.open ()abrirá uma nova janela, enquanto window.location.hrefabrirá o novo URL na sua janela atual.

— Joseph Silber
fonte

window.open () também pode abrir o 'url' na mesma janela se '_self' for passado como parâmetro adicional.

— user761100

1

O window.openURL será aberto na nova guia do navegador

O window.location.hrefURL será aberto na guia atual (você pode usar location)

Aqui está um exemplo de violino (nos trechos SO, window.open não funciona)

Mostrar snippet de código

var url = 'https://example.com';

function go1() { window.open(url) }

function go2() { window.location.href = url }

function go3() { location = url }

<div>Go by:</div>
<button onclick="go1()">window.open</button>
<button onclick="go2()">window.location.href</button>
<button onclick="go3()">location</button>

Expandir snippet

— Kamil Kiełczewski
fonte