My website have tons of internal and external URL.
for my hostname or "#" href it should open in same tab but for any other domain then my hostname should be open in new tab.
This code making all url open in new tab including internal links.
<base target="_blank" rel="noopener noreferrer">
Also tried (https://stackoverflow.com/a/12071371)
$(document).ready(function() {
$('a[href^="https://"],a[href^="http://"]').each(function(){
// NEW - excluded domains list
var excludes = [
'google.com',
'www.example.com',
'*.example.com'
];
for(i=0; i<excludes.length; i++) {
if(this.href.indexOf(excludes[i]) != -1) {
return true; // continue each() with next link
}
}
if(this.href.indexOf(location.hostname) == -1) {
// attach a do-nothing event handler to ensure we can 'trigger' a click on this link
$(this).click(function() { return true; });
$(this).attr({
target: "_blank",
rel: "noreferrer nofollow noopener",
title: "Opens in a new window"
});
$(this).click(); // trigger it
}
})
});Please provide the solution in HTML, javascript or PHP.
With javascript you can loop through all links and add target="_blank" to any links that don't match current domain:
window.addEventListener("DOMContentLoaded", e =>
{
document.querySelectorAll('a[href]').forEach(a =>
{
if (location.hostname == new URL(a.href).hostname)
return;
a.target = "_blank";
a.rel = "noreferrer nofollow noopener";
});
});.content
{
height: 100vh;
}<div class="content">
<a href="/">internal link</a>
<a href="#test">internal link 2</a>
<a href="https://stackoverflow.com">external link</a>
<a href="http://stackoverflow.com">external link 2</a>
</div>
<div id="test" class="content">blah</div>You can loop over all the a elements and check to see if it's href contains http:// or https:// and if so, set target="_blank" on the link:
document.querySelectorAll("a").forEach(function(element){
let href = element.getAttribute("href");
// Check to see if the the href include http:// or https://
if(href.includes("http://") || href.includes("https://")){
element.target = "_blank"; // Make link open in new tab
element.rel = "noreferrer nofollow noopener";
}
console.log(element); // Just for testing
});<a href="foo.html">Link</a><br>
<a href="http://foo.html">Link</a><br>
<a href="foo.html">Link</a><br>
<a href="https://foo.html">Link</a>try adding an 'a' tag inside the tag with the link and target="_blank" inside the 'a' tag