在某些链接上不索引不关注

Question

我有随机文本：

使用JavaScript，我需要替换无跟随和无索引链接。我该怎么做？

我尝试过：

$('.content').html().replace('example.com', '<a href="example.com" rel="nofollow">Example</a>');

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<div class="content">
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Recusandae blanditiis cum numquam qui iure odit. Ipsum beatae magni dicta quibusdam natus. Necessitatibus voluptas nobis <a href="http://example.com">example</a>, esse culpa? Suscipit, consequatur,
    debitis.
  </p>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. <a href="http://example.com">Example 1</a> ullam, vitae laborum aliquam officiis similique, magnam fugiat, <a href="http://example2.com">maxime</a> itaque repellendus iure. Et voluptatem quae
    tenetur neque accusamus atque consectetur totam.
  </p>
</div>

但是我总是得到原文。为什么？

Answer 1

无需替换html。只需使用attributeContains selector

定位这些链接

$('.content a[href *="example.com"]').attr('rel','nofollow')

对于所有外部链接的更通用方法，请使用filter()并对照页面的宿主检查链接的宿主

$('.content a').filter(function(){
    return this.host !== location.host
}).attr('rel','nofollow')

Answer 2

将其添加到文档中的所有链接

如果要将rel属性添加到文档中的所有链接：

// Get all anchor tags in document
const links = document.querySelectorAll('a');

// Add rel='nofollow noindex' attribute to each
[].forEach.call(links, link => {
  link.setAttribute('rel', 'nofollow noindex')
});

仅将其添加到特定链接

如果要更加具体，可以在document.querySelectorAll('a')中调整选择器，使其仅与要转换的链接匹配。

作为示例，您可以在要转换的链接中添加特定的类，并使用选择器（a.your-class-name）定位它们。

使用属性选择器

或者您可以匹配based on the href attribute value with an attribute selector

如果只想在指向http://example.com的链接上执行此操作，而不想在http://example2.com的链接上执行此操作，则可以使用以下选择器：a[href^=http://example.com]（^=的意思是从头开始）。

如果要在带有target="_blank"的链接上进行操作，可以使用a[target=_blank]选择器。

如果要在具有target属性的链接上执行此操作，则不管该值如何，都可以使用a[target]作为选择器。