外链标签属性为什么要使用 rel=noopener

外链超链接标签为什么要使用 rel="noopener"

最近在忙着找友链，在百度友链交换需要注意事项的时候 对方的链接上属性 rel="nofollow"此类的不诚信友链行为之外，还了解个到关于 rel="noopener" 的作用问题， 网上是这样说的

rel="noopener" 是 超链接标签的一个属性。它可以禁止打开的新页面中使用 window.opener 属性，这样一来打开的新页面就不能通过 window.opener 去操作你的页面。 因此 rel="noopener" 应在打开新页面的场景下使用，否则就会导致严重的安全漏洞。如新页面可以通过 window.opener.location = 任意url 将你的页面导航至任何网址。（参考钓鱼链接）

当你的页面链接至使用 target="_blank" 的另一个页面时，新页面将与你的页面在同一个进程上运行。 如果新页面正在执行开销极大的 JavaScript 时，那么你的页面性能可能会受到影响。

所以为了防止页面被滥用 最好加一下 用法如下

1、使用rel=noopener 为了防止window.opener被滥用，在使用targrt=_blank时需要加上rel=noopener

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

2、rel=norefferrer rel=noopener支持chrome49和opera36，不支持火狐，为了兼容需要加上rel=noreferrer

<a href="http://www.yuantk.com/" target="_blank" rel="noopener norefferrer" >

3、JS跳转可以这样处理

var IWindow = window.open();
IWindow.opener = null;
IWindow.location = url;