Skip to content

Instantly share code, notes, and snippets.

@JamoCA

JamoCA/Sanitize_Target_Blank.htm

Last active September 5, 2020 20:51
Show Gist options
  • Save JamoCA/80f65eb07f054b1326221bd4f15868d6 to your computer and use it in GitHub Desktop.
Save JamoCA/80f65eb07f054b1326221bd4f15868d6 to your computer and use it in GitHub Desktop.
Download ZIP
Use jQuery to automatically add noopener, noreferrer and nofollow to links w/target="_blank".
Raw
Sanitize_Target_Blank.htm
<cfcontent type="text/html; charset=UTF-8">
<!doctype html>
<html lang="en">
<head>
<title>Sanitize target="_blank"</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.slim.min.js" type="text/javascript"></script>
<script type="text/javascript">
/* 3/24/2017 Sanitize_Target_Blank.htm https://gist.github.com/JamoCA/80f65eb07f054b1326221bd4f15868d6 */
function sanitizeTargetBlank(){
$('#linkDiv a[rel~=external]').prop('target', '_blank');
$('a[target="_blank"]').each(function(){
var a = $(this);
if(location.hostname !== this.hostname){
var originalRel = (this.rel === undefined) ? '' : this.rel.toLowerCase();
var newRel = originalRel.split(" ");
if (originalRel.indexOf('noopener') === -1){
newRel.push('noopener');
}
if (originalRel.indexOf('noreferrer') === -1){
newRel.push('noreferrer');
}
if (originalRel.indexOf('nofollow') === -1){
newRel.push('nofollow');
}
a.attr('rel', newRel.join(" ").trim() );
}
});
console.log('External AHREF links have been sanitized.', new Date);
}
function viewRel(){
var linkLog = [];
console.log('Identifying all AHREF links with target="_blank"...');
$('#linkDiv a[target="_blank"]').each(function(i){
var a = $(this);
r = a.attr('rel');
if (r !== undefined){
r = r.split(" ");
}
var entry = {
'index': i,
'linkText': a.text(),
'href': a.attr('href'),
'target': a.attr('target'),
'rel': r
};
linkLog.push(entry);
});
console.table(linkLog);
}
</script>
</head>
<body>
<h1>Sanitize target="_blank"</h1>
<ol>
<li>Add target="_blank" to links w/rel="external" (optional; not recommended)</li>
<li>Update "rel" parameter w/noopener, noreferrer, nofollow.</li>
<li>Don't duplicate rel attributes.</li>
<li>Don't sanitize local links.</li>
</ol>
<ol id="linkDiv">
<li><a href="http://www.google.com/" rel="external">Link (existing rel="external")</a></li>
<li><a href="https://www.google.com/" target="_blank">Link w/target="_blank" (no rel)</a></li>
<li><a href="//www.google.com/" target="_blank" rel="noreferrer">Link w/target="_blank" (existing rel=noreferrer)</a></li>
<li><a href="http://localhost/" target="_blank" rel="noreferrer">Local Link w/target="_blank" (existing rel=noreferrer)</a></li>
<li><a href="#anchor" target="_blank">Local Anchor Link w/target="_blank" (no rel)</a></li>
<li><a href="./" target="_blank">Local Link w/target="_blank" (no rel)</a></li>
<li><a href="./">Local Link. No target or rel property.</a></li>
</ol>
<div><button id="testBtn" type="button" onclick="viewRel();">View AHREF data (in console)</button></div>
<div><button id="testBtn" type="button" onclick="sanitizeTargetBlank();">Sanitize AHREF target="_blank"</button></div>
<div><button id="testBtn" type="button" onclick="viewRel();">View AHREF data (in console)</button></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment