如何打开不同的域或子域到新选项卡和相同的域链接到相同的选项卡

时间:2018-09-24 12:30:20

标签: javascript jquery html anchor href

如果链接属于不同的主机名,我需要一种方法在新标签页中打开链接

例1。 页面请求网址:example.com
有链接:

<a href="//app.example.com">app example</a> 
<a href="//www.info.example.com">info example</a>
<a href="https://example.com/abc">example abc</a>
<a href="https://www.example2.com">example2</a>

我需要它来解决

<a href="//app.example.com" target="_blank">app example</a> 
<a href="//info.example.com" target="_blank">info example</a>
<a href="https://example.com/abc" target="_self">example abc</a>
<a href="https://www.example2.com" target="_blank">example2</a>


例2。 页面请求网址:info.example.com
有链接:

<a href="//app.example.com">app example</a> 
<a href="//www.info.example.com">info example</a>
<a href="http://tst.example.com/abc">example abc</a>
<a href="https//dev.example2.com">example2</a>

我需要它来解决

<a href="//app.example.com" target="_blank">app example</a> 
<a href="//wwww.info.example.com" target="_self">info abc</a>
<a href="http://tst.example.com/abc" target="_blank">example abc</a>
<a href="https//dev.example2.com" target="_blank">example2</a>

我也尝试过 Open all external links open in a new tab apart from a domain

但不适用于子域。

3 个答案:

答案 0 :(得分:3)

假设您想与当前页面进行比较,并在其他选项卡中打开任何其他子域或主域,则可以执行以下操作:

$('a').filter(function(){
    return this.host !=== location.host
}).attr('target','_blank');

<a>元素与location具有许多相似的属性,host是其中之一

答案 1 :(得分:0)

您的意思是这样的:

在此代码中,只有google.com会获得_self,everything.google.com和其他网站将获得_blank

如果您使用的是google.com:80,则其中包括google.com:8080;因此,不同的端口也会出现_blank;如果您使用不同的端口,则使用相同的软管,然后更改为location.hostname

let currentHost = "google.com"; // location.host; // change in the real page
$(function() {
  $("a").each(function() {
    this.target=this.host===currentHost?"self":"_blank";
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="https://app.google.com">app google</a><br/>
<a href="https://info.google.com">info google</a> <br/>
**<a href="https://google.com/abc">google abc</a>**<br/>
<a href="https://google.com:8080">other google port</a><br/>
<a href="https://apple.com">apple</a><br/>

答案 2 :(得分:0)

在将主机与锚点的主机进行比较时,可以使用throw new mongoose.Error.OverwriteModelError(name); ^ OverwriteModelError: Cannot overwrite `teams` model once compiled. 代替endswith

但是,正如注释中所指出的,您在Ex1和Ex2之间的规则不匹配:

  • ex1在主机名上使用完全匹配,忽略任何路径(例如google.com 与info.google.com不匹配)
  • ex2使用主机名匹配,忽略左侧的任何内容(例如,info.google.com确实与www.info.google.com匹配)

下面的代码段使用第二个示例中的规则

===
var pagehost1 = "google.com"; // location.host;

$('.ex1 a').each(function(){
    if (this.host.endsWith(pagehost1)) {
        //$(this).attr('target','_blank');
        $(this).addClass("match");
    }
});

var pagehost2 = "info.google.com"; // location.host;

$('.ex2 a').each(function(){
    if (this.host.endsWith(pagehost2)) {
        //$(this).attr('target','_blank');
        $(this).addClass("match");
    }
});
.match { color: green; }
a { display:block; }