Estou trabalhando em um projeto HTML e não consigo descobrir como abrir um link em uma nova guia sem javascript.
Eu já sei que <a href="http://www.WEBSITE_NAME.com"></a>
abre o link na mesma aba. Alguma idéia de como abri-lo em um novo?
Estou trabalhando em um projeto HTML e não consigo descobrir como abrir um link em uma nova guia sem javascript.
Eu já sei que <a href="http://www.WEBSITE_NAME.com"></a>
abre o link na mesma aba. Alguma idéia de como abri-lo em um novo?
Respostas:
Defina o atributo 'target' do link para _blank
:
<a href="#" target="_blank" rel="noopener noreferrer">Link</a>
Editar: para outros exemplos, consulte aqui: http://www.w3schools.com/tags/att_a_target.asp
(Observação: eu sugeri anteriormente, em blank
vez de _blank
, porque, se usado, ele abrirá uma nova guia e, em seguida, usará a mesma guia se o link for clicado novamente. No entanto, isso ocorre apenas porque, como apontou o GolezTrol, refere-se ao nome a de um quadro / janela, que seria definido e usado quando o link for pressionado novamente para abri-lo na mesma guia).
Consideração de segurança!
O rel="noopener noreferrer"
objetivo é impedir que a guia recém-aberta possa modificar a guia original de maneira maliciosa. Para mais informações sobre esta vulnerabilidade, consulte estes recursos:
blank
seria o nome de um quadro ou janela. Pode parecer que funcione porque provavelmente uma nova janela ou guia será aberta quando não existir nenhuma com o nome 'em branco', mas um segundo clique no link deverá abrir a página na mesma guia novamente, em vez de abrir outra.
blank
você poder usar foo
, penso, enquanto _blank
na verdade tem um significado especial. Não consigo encontrar nenhuma informação para provar o contrário. Você pode?
_blank
vai ficar bem; os links serão abertos em uma guia diferente. Se você especificar um nome sem o sublinhado, (por exemplo blank
), os links serão abertos na mesma guia.
Use um destes conforme seus requisitos.
Abra o documento vinculado em uma nova janela ou guia:
<a href="xyz.html" target="_blank"> Link </a>
Abra o documento vinculado no mesmo quadro em que foi clicado (isso é o padrão):
<a href="xyz.html" target="_self"> Link </a>
Abra o documento vinculado no quadro pai:
<a href="xyz.html" target="_parent"> Link </a>
Abra o documento vinculado no corpo inteiro da janela:
<a href="xyz.html" target="_top"> Link </a>
Abra o documento vinculado em um quadro nomeado:
<a href="xyz.html" target="framename"> Link </a>
target="_blank"
tem uma vulnerabilidade, você pode ler sobre ele em mathiasbynens.github.io/rel-noopener
Se você deseja fazer o comando uma vez para todo o site, em vez de precisar fazê-lo após cada link. Experimente este lugar no cabeçalho do seu site e bingo.
<head>
<title>your text</title>
<base target="_blank" rel="noopener noreferrer">
</head>
espero que isto ajude
Use target="_blank"
:
<a href="http://www.example.com/" target="_blank" rel="noopener noreferrer">This will open in a new window!</a>
Quando usar target='_blank'
:
A versão HTML (alguns dispositivos não são compatíveis):
<a href="http://chriscoyier.net" target="_blank">This link will open in new window/tab</a>
A versão JavaScript para todos os dispositivos:
O uso de rel = "external" é perfeitamente válido
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$('a[rel="external"]').attr('target', '_blank');
</script>
e para o Jquery pode tentar com o abaixo:
$("#content a[href^='http://']").attr("target","_blank");
Se a configuração do navegador não permitir que você abra em novas janelas:
href = "google.com";
onclick="window.open (this.href, ''); return false";
target="_blank"
O atributo fará o trabalho. Só não se esqueça de adicionar rel="noopener noreferrer"
para resolver a possível vulnerabilidade. Mais sobre isso aqui: https://dev.to/ben/the-targetblank-vulnerability-by-example
<a href="https://www.google.com/" target="_blank" rel="noopener noreferrer">Searcher</a>
Você pode usar:
<a href="http://www.WEBSITE_NAME.com" target="_blank"> Website</a>
No entanto, as opções acima tornam seu site vulnerável a ataques de phishing. Você pode impedir que isso aconteça em alguns navegadores adicionando rel = "noopener noreferrer" ao seu link. Com isso adicionado, o exemplo acima se torna:
<a href="http://www.WEBSITE_NAME.com" rel="noopener noreferrer" target="_blank">Website.com</a>
confira para obter mais informações: https://www.thesitewizard.com/html-tutorial/open-links-in-new-window-or-tab.shtml
Você poderia fazer assim:
<a href="https://duckduckgo.com/" target="_blank" rel="noopener noreferrer">Open Duck</a>
Observe também o seguinte URL no MDN para obter mais informações sobre segurança e privacidade:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#Security_and_privacy
que por sua vez tem um link para um bom artigo chamado Target = "_ blank" - a vulnerabilidade mais subestimada de todos os tempos :
https://www.jitbit.com/alexblog/256-targetblank---the-most-underestimated-vulnerability-ever/
<a href="url" target="_blank">...</a>