如何使用 JavaScript 为不同的锚元素返回脚注？

Question

我有三个具有唯一 ID 的不同锚链接，我想在同一个链接上对其他一些链接做脚注 page.But 我遇到了问题返回脚注 对于所有三个锚链接都是相同的。

<sup><a href="#one">One&nbsp;&Dagger;</a></sup><br/>
<sup><a href="#two">Two&nbsp;&Dagger;</a></sup><br/>
<sup><a href="#three">Three&nbsp;&Dagger;</a></sup>
  <br/>
  <br/>
  <br/>
  <br/>
  <br/><br/><br/><br/><br/><br/>
  <a href="#" id="one">&#x21B5;Back to footnote</a>

如何返回对上述锚点的脚注引用，例如 "one"、"two"、"three"。

任何帮助将不胜感激...谢谢！！！

Answer 1

如果我对你的问题的理解正确，你希望 links 下降到 "Back to footnote" link，那么你希望 "Back to footnote" link ] 返回到您点击过的 link。如果我对你的问题的解释有误，请发表评论，我会进行调整。

基本上，我为每个 link 添加了一个事件侦听器，当您单击它时，它会将 "Back to footnote" href 更改为正确的锚点：

var $anchors = document.getElementsByClassName('anchor');
var $footnote = document.getElementById('footnote');

for (var i = 0; i < $anchors.length; i++) {
  var $anchor = $anchors[i];
  
  $anchor.addEventListener('click', function () {
    $footnote.href = '#' + this.id;
  });
}

<sup><a id="one" class="anchor" href="#footnote">One&nbsp;&Dagger;</a></sup>
<br><br><br>
<sup><a id="two" class="anchor" href="#footnote">Two&nbsp;&Dagger;</a></sup>
<br><br><br>
<sup><a id="three" class="anchor" href="#footnote">Three&nbsp;&Dagger;</a></sup>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a href="#" id="footnote">&#x21B5;Back to footnote</a>

jQuery

$('.anchor').click(function() {
  $('#footnote').attr('href', '#' + this.id);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<sup><a id="one" class="anchor" href="#footnote">One&nbsp;&Dagger;</a></sup>
<br><br><br>
<sup><a id="two" class="anchor" href="#footnote">Two&nbsp;&Dagger;</a></sup>
<br><br><br>
<sup><a id="three" class="anchor" href="#footnote">Three&nbsp;&Dagger;</a></sup>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a href="#" id="footnote">&#x21B5;Back to footnote</a>

如何使用 JavaScript 为不同的锚元素返回脚注？

How to do back to footnote for different anchor elements using JavaScript?

javascript

footnotes