我们迫切需要帮助来编写一个小的代码，该代码使您可以获取当前页面的URL和href =“ parm”中的参数，并通过使用斜杠将两者结合在一起来创建链接。
我们需要这样做的原因是，我们需要指向当前页面的相对链接。我们正在使用的CMS系统会删除网址末尾的斜杠。
这是一个问题，因为如果您位于页面domain.com/fruit/apple
并创建一个链接，例如href =“ calories”或href =“ ./ calories”，它将指向domain.com/fruit/calories
相反，我们希望它指向domain.com/fruit/apple/calories
相对于当前页面。
我们不想更改CMS的工作方式，因此不需要JS解决方案。
在下面，您可以看到一个我们要完成的示例，但这仅适用于一个链接。
<a href="home" id="relurl" target="_blank" title="This is a relative link!">link</a>
启动JS
var x = window.location.href; // Current page URL
var link = document.getElementById("relurl"); // store the element
var curHref = link.getAttribute('href'); // Get HREF paramter
link.setAttribute('href', x + "/"+ curHref);
结束JS
这个想法是每次使用id =“ relurl”的链接时都建立相对链接。
按照前面的示例，此链接：a href =“ home” id =“ relurl” target =“ _ blank” title =“这是一个相对链接！”>链接
在此页面上：domain.com/fruit/apple
它应该指向domain.com/fruit/apple/home
表示链接结构是currentpageURL ++ // href
一页可能有多个相对链接。
谢谢你的帮助。
虽然您可以在链接中使用相对URL（带有href="./page"），但这听起来像是问题在于您使用重复的ID（导致无效的标记）。您可以使用W3C标记验证服务来测试您是否具有有效的标记。
当您有重复的ID时，JavaScript仅适用于第一个元素。可以在以下内容中看到：
var x = window.location.href; // Current page URL
var link = document.getElementById("relurl"); // store the element
var curHref = link.getAttribute('href'); // Get HREF paramter
link.setAttribute('href', x + "/" + curHref);<a href="home" id="relurl" target="_blank" title="This is a relative link!">Working Link</a>
<br />
<a href="home" id="relurl" target="_blank" title="This is a relative link!">NOT Working</a>若要解决此问题，您应该为链接使用类而不是ID。然后，您可以使用document.getElementsByClassName来选择元素。请记住，这将返回一个NodeList元素集合，因此您需要在循环内设置新的URL，如下所示：
var x = window.location.href; // Current page URL
var links = document.getElementsByClassName("relurl"); // store the elements
for (var i = 0; i < links.length; i++) {
var curHref = links[i].getAttribute('href'); // Get HREF paramter
links[i].setAttribute('href', x + "/" + curHref);
}<a href="home" class="relurl" target="_blank" title="This is a relative link!">Working Link</a>
<br />
<a href="home" class="relurl" target="_blank" title="This is a relative link!">Another Working Link</a>希望这可以帮助！:)
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句