SwiftHTML & CSSSolidityDesenvolvimento de JogosSolana/Rust
10.03.2025

Abrindo uma Nova Janela do Navegador a Partir de um Link Sem JavaScript

Resposta Rápida

Para abrir um link em uma nova janela em vez de uma nova aba, aplique o atributo target com o valor _blank ao elemento <a>. Em seguida, defina os parâmetros da janela usando o evento onclick. Veja como fica em JavaScript:

<a href="javascript:void(0);" onclick="window.open('https://www.example.com', 'novaJanela', 'width=500, height=300');">Abrir em uma nova janela</a>

Esse código abrirá a URL https://www.example.com em uma nova janela com tamanho de 500x300 pixels. Lembre-se de que o comportamento do link pode ser afetado por bloqueadores de pop-up e configurações do usuário no navegador.

Lidando com Bloqueadores de Pop-up

Os bloqueadores de pop-up incorporados na maioria dos navegadores podem interferir com o método window.open(). Aproveite para informar os usuários que ativar pop-ups ou fornecer outra opção de navegação pode ser necessário para que seu site funcione normalmente.

Entendendo o Comportamento do Navegador

Como um navegador interpreta o atributo target="_blank" depende principalmente de como ele escolhe lidar com esse atributo. Geralmente, uma nova aba é aberta em vez de uma nova janela. Navegadores como Chrome e Firefox preferem usar abas para aprimorar a conveniência da interface do usuário. Você não pode alterar esse comportamento do navegador apenas com HTML puro. No entanto, com JavaScript, é possível especificar os parâmetros da janela sendo aberta.

Consistência entre Diferentes Navegadores

Existem diversos navegadores e plataformas nos quais o método window.open() deve funcionar corretamente. É também importante levar em conta as particularidades de como esse método opera em dispositivos móveis, onde o suporte a janelas pode ser limitado. Investigue o comportamento do método em diferentes sistemas para garantir uma experiência do usuário estável.

Visualização

<!-- Vamos contornar o sistema: em vez de uma nova aba, abra uma nova janela! -->

<a href="https://example.com" target="_blank" onclick="window.open(this.href, 'novaJanela', 'width=300,height=250'); return false;">Por favor, abra em uma nova janela!</a>

<!-- Vamos ser educados: pedindo ao usuário “Por favor” -->

<!-- P.S. Não se esqueça de retornar 'false' para cancelar a ação padrão do link. O nosso pequeno segredo ;) -->

Neste exemplo, um truque inteligente é utilizado com apenas cinco linhas de código. Com o elemento <a> e o evento onclick em JavaScript, o navegador abrirá uma nova janela em vez de uma aba.

Avaliando Questões de Segurança

Ao usar window.open(), é aconselhável ter cautela. Os navegadores podem bloquear essa função devido à sua associação com spam e outras práticas não éticas. Ativar essa função normalmente requer uma ação do usuário, como um clique, o que ajuda a minimizar consequências indesejadas.

Uso Inteligente de Frameworks JavaScript

Embora window.open() possa ser utilizado com frameworks como jQuery, sua funcionalidade principal permanece inalterada — essas ferramentas apenas simplificam a sintaxe sem proporcionar controle adicional ou oportunidades para alterar o comportamento padrão do navegador.

Contexto Histórico e Padrões Modernos

Lembre-se dos padrões HTML5: anteriormente, usava-se target="new" para abrir uma nova janela, mas agora é recomendado usar _blank para novos contextos de navegação. Isso torna seu uso mais seguro e em conformidade com os requisitos modernos.

Recursos Úteis

  1. Elemento <a> - HTML: Linguagem de Marcação de Hipertexto | MDN
  2. Atributo target do HTML
  3. javascript - Abrir URL em uma nova aba (não em uma nova janela) - Stack Overflow
  4. Quando Usar target="_blank" | CSS-Tricks
  5. Padrão Vivo de HTML
  6. .attr() | Documentação da API jQuery
  7. WebAIM: Links e Hipertexto - Texto e Aparência do Link

Video

Did you like this article? Rate it from 1 to 5:

Thank you for voting!