如何在HTML的新标签页中打开链接?

html HTML

小卤蛋Pro

2020-03-23

我正在处理HTML项目,但是我不知道如何在没有JavaScript的情况下在新标签页中打开链接。

我已经知道可以<a href="http://www.WEBSITE_NAME.com"></a>在同一选项卡打开链接。有什么想法可以使其在新的环境中打开吗?

第2893篇《如何在HTML的新标签页中打开链接?》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

6个回答
猴子GO 2020.03.23

您可以使用:

<a href="http://www.WEBSITE_NAME.com"  target="_blank"> Website</a>

但是,以上内容使您的站点容易受到网络钓鱼攻击。您可以通过在链接中添加rel =“ noopener noreferrer”来防止在某些浏览器中发生。加上这个,上面的例子变成:

<a href="http://www.WEBSITE_NAME.com" rel="noopener noreferrer" target="_blank">Website.com</a> 

请查看更多信息:https : //www.thesitewizard.com/html-tutorial/open-links-in-new-window-or-tab.shtml

猴子村村 2020.03.23

如果您想对整个站点执行一次命令,而不必在每个链接之后都执行一次。在您的网站和Bingo头内尝试这个地方。

<head>
<title>your text</title>
<base target="_blank" rel="noopener noreferrer">
</head>

希望这可以帮助

西里Near 2020.03.23

用途target="_blank"

<a href="http://www.example.com/" target="_blank" rel="noopener noreferrer">This will open in a new window!</a>
凯西里 2020.03.23

target="_blank"属性将完成工作。只是不要忘记添加rel="noopener noreferrer"以解决潜在的漏洞。此处的更多信息:https : //dev.to/ben/the-targetblank-vulnerability-by-example

<a href="https://www.google.com/" target="_blank" rel="noopener noreferrer">Searcher</a>
十三 2020.03.23

根据您的要求使用其中之一。

在新窗口或标签中打开链接的文档:

 <a href="xyz.html" target="_blank"> Link </a>

在与单击相同的框架中打开链接的文档(这是默认设置):

 <a href="xyz.html" target="_self"> Link </a>

在父框架中打开链接的文档:

 <a href="xyz.html" target="_parent"> Link </a>

在窗口的整个正文中打开链接的文档:

 <a href="xyz.html" target="_top"> Link </a>

在命名框架中打开链接的文档:

 <a href="xyz.html" target="framename"> Link </a>

见MDN

Green猿 2020.03.23

将链接的“目标”属性设置为_blank

<a href="#" target="_blank" rel="noopener noreferrer">Link</a>

编辑:有关其他示例,请参见此处:http : //www.w3schools.com/tags/att_a_target.asp

(注意:我之前建议这样做,blank而不是_blank因为如果使用它,它将打开一个新选项卡,如果再次单击该链接,则会使用相同的选项卡。但是,这仅是因为正如GolezTrol所指出的那样,它指向名称框架/窗口的a,当再次按下链接以在同一标签中将其打开时,将进行设置和使用)。

安全考虑!

rel="noopener noreferrer"是为了防止新开启的分页从能够恶意修改原来的标签。有关此漏洞的更多信息,请参见以下资源:

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android