首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

使用vanilla JS将rel="noopener noreferrer nofollow“添加到所有外部链接的最佳方法

使用vanilla JS将rel="noopener noreferrer nofollow"添加到所有外部链接的最佳方法是通过遍历页面中的所有链接,并检查链接是否指向外部域名。以下是一个实现此功能的示例代码:

代码语言:txt
复制
// 获取页面中的所有链接元素
const links = document.querySelectorAll('a');

// 遍历链接元素并添加rel属性
links.forEach(link => {
  const href = link.getAttribute('href');

  // 检查链接是否指向外部域名
  if (href.startsWith('http') && !href.includes(window.location.hostname)) {
    link.setAttribute('rel', 'noopener noreferrer nofollow');
  }
});

这段代码首先使用querySelectorAll方法选择所有<a>元素,并将其存储在links变量中。然后,使用forEach方法遍历所有链接元素,并获取链接的href属性。

接下来,通过检查链接的href属性是否以http开头且不包含当前页面的域名来判断链接是否指向外部域名。如果是外部链接,就使用setAttribute方法添加rel属性为noopener noreferrer nofollow

这样,所有指向外部链接的<a>元素都会被添加上rel="noopener noreferrer nofollow"属性。

对于此问题,腾讯云没有直接相关的产品或产品介绍链接地址。然而,腾讯云提供了丰富的云计算产品和解决方案,例如云服务器、云数据库、云存储、人工智能等,可用于构建和扩展云计算应用程序。您可以访问腾讯云官方网站(https://cloud.tencent.com/)了解更多信息。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

a标签 rel=“external nofollow“ 用法

这个属性基本上是相当于两种属性结合起来,大致可以解释为 “这个链接非本站链接,不要爬取也不要传递权重”。因此在SEO角度来说,是一种绝对隔绝处理方法,可以有效减少蜘蛛爬行流失。...rel="nofollow noopener noreferrer" 超链接 target="_blank" 要增加 rel="nofollow noopener noreferrer" 来堵住钓鱼安全漏洞...如果你在链接使用 target="_blank"属性,并且不加上rel="noopener"属性,那么你就让用户暴露在一个非常简单钓鱼攻击之下。...在老浏览器中,可以使用 rel=noreferrer 禁用HTTP头部Referer属性,使用下面JavaScript代替target='_blank' 解决此问题: 1 2 3...更多资料,请参考:超链接 target="_blank" 要增加 rel="nofollow me noopener noreferrer" 来堵住钓鱼安全漏洞

1.4K20
  • get几个小技能:轮播图插件、进度条插件、筛选过滤插件

    具体可以查看:官方文档 以及 基础演示 Swiper简单使用 在做网页中主要用到了swiper纵向轮播,来制造一个容器,使每一个轮播框都成为一个页面,而达到这样效果: 引入swiper.min.js.../Swiper/4.5.1/js/swiper.min.js"> 简单使用,代码如下: <!...主要用到了 wowslider.css、wowslider.js、script.js、jquery.js 源码下载:点击下载 链接:https://pan.baidu.com/s/1I-Y7mKae0XL6vz6amABkGA...="nofollow noopener" rel="nofollow noopener" rel="nofollow noopener" rel="nofollow noopener" rel=...插件,带有动画效果,具体可以查看 演示地址 源码下载 链接:https://pan.baidu.com/s/11ofYY5LG5kNuNh_j1YzUGA 提取码:zhhe 使用方法 <!

    1.7K20

    UI框架——后台管理系统模板

    :https://itheima2017.gitbooks.io/adminlte2-itheima-doc/ 由于AdminLTE仪表盘代码过于复杂,因为组件太多,要自己灵活使用要花很多时间了解源代码...因此,自己根据自己想法,注释并且简洁化修改了这个模板,可以根据自己需求很灵活使用起来。 修改后界面如下 单页代码 <!...www.layui.com/admin/pro/ layui组件演示:https://www.layui.com/demo/ layui文档:https://www.layui.com/doc/ 使用后台管理系统模板主要是能自己改写和使用系统中相关组件和布局样式..."nofollow noopener" rel="nofollow noopener" >所有商品 <dl class="layui-nav-child...: https://www.layui.com/admin/ 也可以点击以下<em>链接</em>下载自己改写后<em>的</em>源代码 <em>链接</em>:https://pan.baidu.com/s/1RODE32nrh62xeoBCRHFteQ

    7.3K41

    Hexo博客推荐安装插件

    比如 设置target=’_blank’, rel=’external nofollow noopener noreferrer’ 告诉搜索引擎这是外部链接,不要将该链接计入权重。...: 'external nofollow noopener noreferrer' domain: 'https://www.antmoe.com/' # 如果开启了防盗链 safety_chain...’ target_blank - 是否为外链a标签添加target='_blank' - 默认 true link_rel - 设置外链a标签rel属性 - 默认 ‘external nofollow...noopener noreferrer’ domain - 如果开启了防盗链,除了 localhost 和 domain 之外调用会跳到主页,同时也是判断链接是否为外链依据 - 默认 window.location.host...值得注意是:这个加入了图片压缩,如果不想用图片压缩可以把第154行 "compressImage", 和第165行 ,"compressImage" 去掉即可 第二种方法通过插件完成,也是我目前使用方法

    1.3K20

    安全开发小知识记录

    框架或者窗口不存在,浏览器打开一个新窗口,给这个窗口一个指定标记,然后超链接文档就可以指向这个新窗口。...您可以把target=”_blank”理解为新浏览器窗口打开此超链接; 关键点: 如果您使用了该属性却没有添加rel=”noopener noreferrer”得话就会存在一定得安全风险; 原理解析...:我们唯一目的就是限制window.opener访问行为,此时我只需要在标签中加上一个rel="noopener"属性(chrome)或者rel="noreferrer"属性(火狐),当然您可以两个属性值合并写成...rel="noopener noreferrer"来完整覆盖,此时子页面就再也访问不到父页面的句柄所以更无法操作原窗口句柄; 也可以通过js来控制限制句柄访问: var otherWindow =...target=”_blank”后面添加一句rel="noopener noreferrer"。

    70010

    安全开发小知识记录

    框架或者窗口不存在,浏览器打开一个新窗口,给这个窗口一个指定标记,然后超链接文档就可以指向这个新窗口。...您可以把target=”_blank”理解为新浏览器窗口打开此超链接; 关键点: 如果您使用了该属性却没有添加rel=”noopener noreferrer”得话就会存在一定得安全风险; 原理解析...:我们唯一目的就是限制window.opener访问行为,此时我只需要在标签中加上一个rel="noopener"属性(chrome)或者rel="noreferrer"属性(火狐),当然您可以两个属性值合并写成...rel="noopener noreferrer"来完整覆盖,此时子页面就再也访问不到父页面的句柄所以更无法操作原窗口句柄; 也可以通过js来控制限制句柄访问: var otherWindow =...target=”_blank”后面添加一句rel="noopener noreferrer"。

    46910

    精选 Flexport 在 HackerOne 这一年 6 个有趣安全漏洞

    所有在 React 之外工作库都不能信任,并且要尽可能地避免使用它们。...修复: 所有传递到 dangerouslySetInnerHtml 文本都使用 XSS 过滤器,并创建一个 Lint 规则以在将来执行此操作。...攻击者可以原始页面设置为登录页面或其他任何内容。只能将 rel="noopener noreferrer" 添加到 a 标签中,来减轻这一类问题。...修复: 通过在使用 target="_blank" 时增加 rel="nofollow me noopener noreferrer" ,我们修复了该问题,这样新窗口就不能改变原始窗口内容。...攻击者所要做就是忽略 2FA 页面并导航到另一个链接。 ? 原因: 在本文中所有的 bug 中,这一个是最难找到

    2.3K80
    领券