首页/SEO技术/正文
关于a标签属性rel=”noopener noreferrer”

 2022年03月18日  阅读 349  评论 0

摘要:关于a标签属性rel="noopener noreferrer",为了防止window.opener被滥用,在使用targrt=_blank时需要加上rel=noopener,rel=noopener支持chrome49和opera36,不支持火狐,为了兼容需要加上rel=noreferrer.

1、网站为什么要使用a标签rel=’noopener’这个属性

黑帽百科先给大家举个例子说明一下,请看以下代码:

<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<meta http-equiv=”X-UA-Compatible” content=”ie=edge”>
<title>Document</title>
</head>
<body>
<a href=”a.html” target=”_blank”>da</a>
</body>
</html>
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<meta http-equiv=”X-UA-Compatible” content=”ie=edge”>
<title>Document</title>
</head>
<body>
<SCRIPT>window.opener.location.href =”http://google.com”</SCRIPT>
</body>
</html>

大家看以上代码中a标签有个超级链接,点开后弹出新的tab页面,但发现点开后不是自己想的的页面,而变百民google页面,主要原因是代码赋予了tab页面新的权限,如果网站a标签超级链接中使用了rel=’noopener’这个属性,就不会有这种情况发生了,就不会让用户在钓鱼攻击上,这样说大家就该就明白了,黑帽百科为大家讲解的都是通俗易懂的,很少使用专业的术语。

2、使用a标签rel=’noopener’属性

使用a标签rel=’noopener’属性就是为了防止止window.opener功能被滥用了,因此在A标签超级链接中加上了targrt=_blank就需要加上rel=’noopener’这个属性,代码如下所示:

<a href=”www.***.com” target=”_blank” rel=”noopener” >

3、配合使用a标签rel=’norefferrer’属性

a标签rel=’noopener’属性支持chrome49和opera36浏览器,但是不支持火狐浏览器,但为了能够兼容火狐浏览器,所以要加上a标签rel=’norefferrer’ 这个属性。

<a href=”www.baidu.com” target=”_blank” rel=”noopener norefferrer” >

版权声明:本文为 “黑帽百科” 原创文章,转载请附上原文出处链接及本声明;

原文链接:https://www.heimao.wiki/post/56635.html

标签:

发表评论:

关于我们
黑帽百科:黑帽seo百科,黑帽seo技术学习培训分享,黑帽SEO快排程序分享,定制。 SEO快速排名收录学习 老师qq:25496334
扫码关注
联系方式
全国服务热线:
地址:新加坡 - 市中心(Singapore City)乌节路
Email:hack66666@foxamil.com
邮编:
Copyright Your 黑帽百科.|网站地图.Some Rights Reserved.