html语言 rel标签,HTML5中的rel属性

rel 属性规定当前文档与被链接的url(使用href=""指定)之间的关系

仅标签中使用的rel值：

stylesheet：调用外部样式表，用于链接css样式表

icon：指定标题栏,地址栏,收藏栏小图标，rel="shortcut icon" 为了兼容IE，必须包含shortcut才会在IE下显示，IE只支持ico格式

canonical：指明网址的规范版本,用于让搜索引擎知道当前网站中的重复或相似网页中，哪一个页面才是站长想让其抓取与收录的。

author：文档作者，一般指向作者的主页

alternate：备选的源(比如:打印页, 译本和镜像)

home：站点的主页

start：当前文档的第一页<

archives：集合的目录

toc：集合的目录

head：集合中的顶级文档

first：集合中的首个文档

next：集合中的下一个文档

prev：集合中的前一个文档

last：集合中最后的文档

search：文档的搜索工具

copyright：当前文档的版权或隐私页面网站底部版权

help：帮助文档

bookmark：用作书签的永久URL列表标题

tag：当前文档标签(关键词)页

friend：赞助友情链接

其他几个常见的非link标签使用的值：

nofollow：未认可的页面，加上这个标签后就不会传递权重，在很大程度上抑制博客或论坛的垃圾留言。

nofollow有两种用法：

1.用于meta元标签：，告诉爬虫该页面所有链接都无需追踪

2.用于a标签：登录,告诉爬虫该页面无需追踪

noopener：用于在a标签中的rel属性的值，一般搭配target="_blank"同时使用，使子页面不能获取到window.opener。因为a标签中target="_blank"有一个安全漏洞：新的页面可以通过window.opener访问您的窗口对象，如使用window.opener.location=newURL将您的页面导航至不同的网址

新版本的chrome为了安全已经默认添加noopener，如果需要在子页面访问父页面需要在父页面的超链接显示的输入rel="opener"才能在子页面获取父页面

noreferrer：页面跳转时，浏览器不发送Referer字段，、和标签的rel属性可以使用这个属性

PS:实测在chrome中仅使用noreferrer(前提是使用了target="_blank")在子页面不能获取document.referrer，同时获取window.opener也返回null，但是仅使用noopener则只获取不到window.opener。

Referrer Policy：

rel属性只能定制单个元素的Referer行为，而且选择比较少，只能发送或不发送。W3C为此制定了更强大的 Referrer Policy。

Referrer Policy 可以设定8个值。

(1)no-referrer：不发送Referer字段。

(2)no-referrer-when-downgrade：如果从HTTPS链接到HTTP，不发送Referer字段，其他情况发送。这是浏览器的默认行为

(3)same-origin：链接到同源网址(协议+域名+端口都相同)时发送，否则不发送

(4)origin：一律只发送源信息(协议+域名+端口)

(5)strict-origin：如果从HTTPS链接到HTTP，不发送Referer字段，其他情况只发送源信息

(6)origin-when-cross-origin：同源时，发送完整的Referer字段，跨域时发送源信息

(7)strict-origin-when-cross-origin：同源时，发送完整的Referer字段；跨域时，如果HTTPS链接到HTTP不发送Referer字段，否则发送源信息。

(8)unsafe-url：Referer字段包含源信息、路径和查询字符串，不包含锚点、用户名和密码。

Referrer Policy 有多种使用方法。

(1)HTTP 头信息

服务器发送网页的时候，通过 HTTP 头信息的Referrer-Policy告诉浏览器。

Referrer-Policy: origin

(2)标签

也可以使用标签，在网页头部设置。

(3)referrerpolicy属性

、、、和标签，可以设置referrerpolicy 属性。

xxx

最后编辑：2021-03-26作者：qingheluo

这个作者貌似有点懒，什么都没有留下。