Método Window open()

Definição e uso

open() O método abre uma nova janela ou nova aba do navegador, dependendo das configurações do seu navegador e dos valores dos parâmetros.

Veja também:

Método close()

Exemplo

Exemplo 1

Abra "www.codew3c.com" em uma nova aba do navegador:

window.open("https://www.codew3c.com");

Experimente você mesmo

Mais exemplos estão disponíveis na parte inferior da página.

Sintaxe

window.open(url, name, features, replace)

Parâmetros

Parâmetros descrição
url

Opcional. URL da página a ser aberta.

Se não for especificado urlserá aberta uma nova janela ou aba em branco.
name Opcional. Propriedade target ou nome da janela.
features Opcional. Lista de itens separados por vírgula, sem espaços.
replace

Descontinuado.

Determina se a URL cria um novo item ou substitui o documento atual na lista de histórico.

Suporta os seguintes valores:

  • true - Substitui o documento atual na lista de histórico da URL
  • false - Cria um novo item na lista de histórico da URL

Aviso:O Chrome ao usar replace O parâmetro gera uma exceção.

O parâmetro name suporta os seguintes valores:

valor descrição
_blank A URL é carregada em uma nova janela ou aba. O padrão.
_parent A URL é carregada no frame pai.
_self Substitua a URL na página atual.
_top URL substitui qualquer conjunto de frames que possam ser carregados.
name o nome da janela (não especifica o título da janela).

os parâmetros de features suportam os seguintes valores:

valor descrição
fullscreen=yes|no|1|0 se exibir o navegador em modo de tela cheia. O padrão é não. As janelas de modo de tela cheia também devem estar no modo cinema. Apenas IE.
height=pixels altura da janela, em pixels. O valor mínimo é 100.
left=pixels posição esquerda da janela (coordenada X), em pixels. Não são permitidos valores negativos.
location=yes|no|1|0 se exibir o campo de endereço. Apenas Opera.
menubar=yes|no|1|0 se exibir a barra de menu.
resizable=yes|no|1|0 se a janela pode ser redimensionada. Apenas IE.
scrollbars=yes|no|1|0 se exibir a barra de rolagem. Apenas IE, Firefox e Opera.
status=yes|no|1|0 se adicionar a barra de status.
titlebar=yes|no|1|0 se exibir a barra de título. A menos que o aplicativo chamado seja um aplicativo HTML ou um diálogo confiável, será ignorado.
toolbar=yes|no|1|0 se exibir a barra de ferramentas do navegador. Apenas IE e Firefox.
top=pixels posição superior da janela (coordenada Y), em pixels. Não são permitidos valores negativos.
width=pixels largura da janela, em pixels. O valor mínimo é 100.

retorno

retorna uma referência para a nova janela, ou null se a chamada falhar.

detalhes técnicos

descrição

open() método busca uma janela existente ou abre uma nova janela do navegador. Se name se for especificado, retorna uma referência para essa janela. A janela retornada exibirá url parâmetro especifica o documento, mas ignora features parâmetro. Quando só se conhece o nome da janela, isso é a única maneira que o JavaScript pode obter uma referência para essa janela.

se não for especificado name parâmetro, ou se a janela especificada não existir, então open() método cria uma nova janela do navegador. Esta nova janela exibirá url parâmetro URL, cujo nome é especificado pelo name tamanho e controles são especificados pelo features parâmetro especifica. url se estiver vazio, então open() para abrir uma nova janela.

name parâmetro especifica o nome da nova janela. Este nome pode conter apenas números, letras ou sublinhados. Ele pode ser usado como <a> e <form> o valor da propriedade target, para forçar a exibição do documento neste janela específica.

ao usar o método Window.open() Ao carregar um novo documento em uma janela específica existente, você pode passar replace 参数，用来声明新文档是在窗口的浏览历史中拥有自己的条目，还是替换当前文档的条目。如果 replace parâmetro, usado para declarar se o novo documento terá sua própria entrada no histórico de navegação da janela ou se ele substituirá a entrada atual do documento. Se replace seu valor for true, o novo documento substituirá o documento antigo. Se o valor for false ou omitido, o novo documento terá sua própria entrada no histórico de navegação da janela. A função fornecida por esse parâmetro é semelhante à função

Método Location.replace() Window.open() métodos são muito semelhantes. Método Document.open(), para que seu código seja claro e legível, é melhor usar Window.open(), e não como open(). Normalmente, no contexto de um evento definido como atributo HTML, a função open() é interpretada como Document.open()por isso, nessa situação, é necessário usar Window.open().

Características da Janela

features o parâmetro é a lista de características que a janela deve exibir, separadas por vírgula. Se o valor desse parâmetro opcional estiver vazio ou omitido, a janela exibirá todas as características. No entanto, se features especifica uma característica, então as características que não aparecem na lista não serão exibidas na janela. É importante notar que essa string não contém nenhum espaço ou caractere de espaço, e cada elemento tem o formato conforme mostrado a seguir:

feature[=value]

Para a maioria das características,value Os valores são yes ou no. Após essas características, o sinal de igual e value Os valores podem ser omitidos, se a característica for especificada, é assumido value O valor é yes, se não for especificado, é assumido value O valor é no. No entanto, se a característica width ou height value Os valores são obrigatórios e devem ser especificados em pixels.

Suporte do navegador

Todos os navegadores suportam open():

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Suporte Suporte Suporte Suporte Suporte Suporte

Mais exemplos

Exemplo 2

Abra a página about:blank em uma nova janela/aba:

var myWindow = window.open("", "", "width=200,height=100");

Experimente você mesmo

Exemplo 3

Abra uma nova janela com o nome "MsgWindow" e escreva alguns textos dentro dela:

var myWindow = window.open("", "MsgWindow", "width=200,height=100");
myWindow.document.write("<p>This is 'MsgWindow'. I am 200px wide and 100px tall!</p>");

Experimente você mesmo

Exemplo 4

Substitua a janela atual com uma nova janela:

var myWindow = window.open("", "_self");
myWindow.document.write("<p>Substituí a janela atual.</p>")}

Experimente você mesmo

Exemplo 5

Abrir nova janela e controlar sua aparência:

window.open("https://www.codew3c.com", "_blank", "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");

Experimente você mesmo

Exemplo 6

Abrir várias abas:

window.open("http://www.google.com/");
window.open("https://www.codew3c.com/");

Experimente você mesmo

Exemplo 7

Abrir nova janela. Em seguida, usar close() para fechar essa nova janela:

function openWin() {
  myWindow = window.open("", "myWindow", "width=200,height=100");   // Abrir nova janela
}
function closeWin() {
  myWindow.close();   // Fechar essa nova janela
}

Experimente você mesmo

Exemplo 8

Abrir nova janela. Usar a propriedade name para retornar o nome da nova janela:

var myWindow = window.open("", "MsgWindow", "width=200,height=100");
myWindow.document.write("<p>O nome dessa janela é: " + myWindow.name + "</p>");

Experimente você mesmo

Exemplo 9

Usar a propriedade opener para retornar uma referência para a janela que criou a nova janela:

var myWindow = window.open("", "myWindow", "width=200,height=100");   // Abrir nova janela
myWindow.document.write("<p>Esta é 'myWindow'</p>");   // Texto na nova janela
myWindow.opener.document.write("<p>Esta é a janela de origem!</p>");  // Criar nova janela no texto da janela criada

Experimente você mesmo