访问相对 URL 上的锚点

Question

我正在为大约 30 个页面设置一个模板，这意味着我不能使用绝对 URL，但每个页面的结构和父页面将是相同的（它只会包含不同的信息）。 我找不到将相对 URL 与锚标记相结合的方法，但我确实使用 Javascript 设法实现了这一点。 我觉得我已经完全把它复杂化了，即使它有效，也必须有更好的方法。 这是我的 JS，它在结束正文标记之前执行。

var url = window.location.href;
var file = url.split('?')[0];
var pathanddomain = file.split('/');
var path = pathanddomain.splice(1, pathanddomain.length-1);
var pathIndexToGet = 3;
var anchor1 = '../' + (path[pathIndexToGet]) + '#sec1';
var anchor2 = '../' + (path[pathIndexToGet]) + '#sec2';
var anchor3 = '../' + (path[pathIndexToGet]) + '#sec3';
var anchor4 = '../' + (path[pathIndexToGet]) + '#sec4';
var link1 = document.getElementById('seclink1');
var link2 = document.getElementById('seclink2');
var link3 = document.getElementById('seclink3');
var link4 = document.getElementById('seclink4');
link1.href = anchor1;
link2.href = anchor2;
link3.href = anchor3;
link4.href = anchor4;

以及它所指的 HTML：

<a id="seclink1">Section 1</a>
<a id="seclink2">Section 2</a>
<a id="seclink3">Section 3</a>
<a id="seclink4">Section 4</a>

这是完成这项任务的最有效方法吗？

将它组合成一行是否会更有效，而不是如此频繁地使用变量？ IE

document.getElementById('seclink1').href = '../' + (path[pathIndexToGet]) + '#sec1';

Answer 1

它很简单，例如：

var url = location.pathname;
var anchor = url.split("/").pop();
for(var i=1;i<5;i++){
document.getElementById(`seclink${i}`).href = '../' + anchor + `#sec${i}`;
}

Answer 2

IMO，是的，它会更高效，并且组合 for 循环更具可读性。

for(var i = 1 ; i <= linksNumber ; i++){
  document.getElementById('seclink'+i).href = '../' + (path[pathIndexToGet]) + '#sec'+i;
}