I want to add extra value into attributes where all links were rel='nofollow' and href='example.com'.For more details, I attach my code below.
My Expected Output:
<a target="_blank" rel="nofollow sponsored" class="" href="https://amzn.to/tes" style="width: 100%;">Aff Link</a>
<a target="_blank" rel="follow" href="example.com">Follow</a>
My code Below:
var test = jQuery('a').attr('href').split('/')[2];
if (test == 'amzn.to') {
jQuery('a').attr('rel', 'nofollow sponsored');
console.log(test);
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery Rel Attribute</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<a href="example.com">Example link</a> <br>
<a target="_blank" rel="nofollow" class="" href="https://amzn.to/tessdft" style="width: 100%;">
Link 1
</a> <br>
<a target="_blank" rel="nofollow" class="" href="https://amzn.to/testws" style="width: 100%;">
Link 2
</a> <br>
<a target="_blank" rel="nofollow" class="" href="https://amzn.to/testee" style="width: 100%;">
Link
</a> <br>
</body>
</html>
Your line
jQuery('a').attr('href')
will only return the href for the first a - you need to loop each a:
console.log("before: " + $("a[rel*=sponsored]").length)
$("a").each(function() {
var test = $(this).attr('href').split('/')[2];
if (test == 'amzn.to') {
$(this).attr('rel', 'nofollow sponsored');
console.log(test);
}
});
console.log("after: " + $("a[rel*=sponsored]").length)
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<a href="example.com">Example link</a> <br>
<a target="_blank" rel="nofollow" href="https://amzn.to/tessdft">Link 1</a><br>
<a target="_blank" rel="nofollow" href="https://amzn.to/testws">Link 2</a><br>
<a target="_blank" rel="nofollow" href="https://amzn.to/testee">Link3</a><br>
There is also an overload for .attr which allows you to pass a function
console.log("before: " + $("a[rel*=sponsored]").length)
$("a").attr("rel", function() {
var test = $(this).attr('href').split('/')[2];
if (test == 'amzn.to') {
return 'nofollow sponsored';
}
});
console.log("after: " + $("a[rel*=sponsored]").length)
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<a href="example.com">Example link</a> <br>
<a target="_blank" rel="nofollow" href="https://amzn.to/tessdft">Link 1</a><br>
<a target="_blank" rel="nofollow" href="https://amzn.to/testws">Link 2</a><br>
<a target="_blank" rel="nofollow" href="https://amzn.to/testee">Link3</a><br>