jQuery 获取部分 url 并将其应用到现有链接的末尾

Posted

技术标签:

【中文标题】jQuery 获取部分 url 并将其应用到现有链接的末尾【英文标题】:jQuery to get part of a url and apply it to the end of an existing link 【发布时间】:2021-08-15 17:30:58 【问题描述】:

我正在为 Wordpress 多站点创建脚本,以允许用户在站点之间切换,即 EN、FR、DE。

菜单中的链接结构如下:

<li class="en-link">
<a href="https://example.com" />EN</a>
</li>
<li class="fr-link">
<a href="https://example.com/fr" />FR</a>
</li>

我希望用户能够在这些站点之间来回切换。但这显然不适用于子页面。所以我需要能够获取第一个正斜杠前面的所有内容并将其应用于这些链接。

这是我目前拥有的:

jQuery(function ($) 
var currentURL = (document.URL); 
var part = currentURL.split("/")[1];
$(".en-link a").attr('href', $(".en-link a").attr('href') + part);
$(".fr-link a").attr('href', $(".fr-link a").attr('href') + part); 
);

但无济于事。有什么想法吗?

【问题讨论】:

document.location.pathname ? 您是否使用插件在多站点上进行翻译? 网站上没有翻译插件。全部手动。 【参考方案1】:

您可以从 javascript 的内置 Location 获取路径,window.location.pathname.split('/')[1] 将为您提供路径的第一段,取决于您的 url,这将是“fr”、“de”或“en”

【讨论】:

【参考方案2】:

这就是使用 jQuery 对我有用的方法

$(document).ready(function () 
var trail = window.location.href.substr(window.location.href.lastIndexOf("/")+1); 
$(".en-link").find('a').attr('href', $(".en-link").find('a').attr('href') + trail);
$(".fr-link").find('a').attr('href', $(".fr-link").find('a').attr('href') + trail); 
  ); 

但也需要针对新闻和媒体部分的子页面进行计数:

jQuery(function ($) 
  $(document).ready(function () 
var trail = window.location.href.substr(window.location.href.lastIndexOf("/")+1);  
  var trailSub = window.location.href.substr(window.location.href.lastIndexOf("/")-5);  
    if (window.location.href.indexOf("press") != -1) 
$(".en-link").find('a').attr('href', $(".en-link").find('a').attr('href') + trailSub);
$(".fr-link").find('a').attr('href', $(".fr-link").find('a').attr('href') + trailSub); 
    
    else if (window.location.href.indexOf("media") != -1) 
$(".en-link").find('a').attr('href', $(".en-link").find('a').attr('href') + trailSub);
$(".fr-link").find('a').attr('href', $(".fr-link").find('a').attr('href') + trailSub); 
    
    else 
      $(".en-link").find('a').attr('href', $(".en-link").find('a').attr('href') + trail);
$(".fr-link").find('a').attr('href', $(".fr-link").find('a').attr('href') + trail); 
    
  );
);

我确信这可以简化,但现在已经缩小了。

【讨论】:

以上是关于jQuery 获取部分 url 并将其应用到现有链接的末尾的主要内容,如果未能解决你的问题,请参考以下文章

获取 URL 哈希位置,并在 jQuery 中使用它

使用 JavaScript 获取当前完整的 URL 并将其与 jQuery 一起使用

需要一个快速的 jquery 解决方案来捕获当前 url 并将其注入另一个 url 链接

使用 jQuery 获取当前 URL?

jQuery 可以获取与元素关联的所有 CSS 样式吗?

从 URL 获取图像并将其附加到数组