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

Posted 2023-03-05

【中文标题】如何将不同的域或子域打开到新选项卡以及相同的域链接到相同的选项卡

【英文标题】：How to open different domain or sub domain to new tab and same domain link to same tab

【发布时间】：2019-02-27 23:22:00

【问题描述】：

如果链接属于不同的主机名或不同的子域，我需要一种在新选项卡中打开链接的方法。有可能同一站点可以托管在不同的域或子域中。 我无法控制 html，因为这是由某种机器人获取的，我需要对其进行处理。 例 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

但它不适用于子域。

【问题讨论】：

你能分享你更新的js代码吗？提供的链接中的问题恰恰相反（但应该适用于您的场景）并且答案的作用非常不同。

嗨，@freedomn-m 我已经更新了我的问题，现在应该澄清更多。

【参考方案1】：

你的意思是这样的：

在此代码中，只有 google.com 会得到 _self，anything.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/>

【讨论】：

我想这在我的情况下不起作用，你能再次检查我的问题吗？我已经更新了更清楚@mplungjan

@UjjwalJha 我不明白你的规范。您的一半 href 无效，我没有看到示例 1 和示例 2 之间的模式。请解释“Google 有链接”的规则没有意义

我已经更新了，你能看懂吗@mplungjan

不。我没有看到对问题的描述有任何改进。 “Google 有链接”对我来说没有任何意义

在一个网站中，有 3-4 个子域和很少的外部链接，每当我通过锚标签导航时我想要什么 如果导航 URL 相同，它应该在同一个选项卡中打开，否则应该在新的标签。我希望这会让你更清楚@mplungjan

【参考方案2】：

假设您想与当前页面进行比较并在其他选项卡中打开任何其他子域或主域，您可以这样做：

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

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

【讨论】：

不知道您可以在<a> 上执行this.host。不错

喜欢过滤器

【参考方案3】：

在将主机与主播的主机进行比较时，您可以使用endswith 而不是===。

但是，正如 cmets 中所指出的，您在 Ex1 和 Ex2 之间的规则不匹配：

ex1 使用完全匹配的主机名，忽略任何路径（例如 google.com 不 匹配 info.google.com） ex2 使用主机名匹配，忽略左侧的任何内容（例如 info.google.com 确实匹配 www.info.google.com）

下面的 sn-p 使用第二个例子中的规则

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; 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class='ex1'>
<a href="//app.google.com">app google</a> 
<a href="//www.info.google.com">info google</a>
<a href="https://google.com/abc">google abc</a>
<a href="https://www.apple.com">apple</a>
</div>

<hr/>

<div class='ex2'>
<a href="//app.google.com">app google</a> 
<a href="//www.info.google.com">info google</a>
<a href="http://wwwtst.google.com/abc">google abc</a>
<a href="https//wwwdev.apple.com">apple</a>
</div>