例如：

This is main body of my content. I have a
  footnote link for this line [1]. Then, I have some more
  content. Some of it is interesting and it
  has some footnotes as well [2].
  
  [1] Here is my first footnote.
  
  [2] Another footnote.

因此，如果我单击" [1]"链接，它将把网页定向到第一个脚注参考，依此类推。我如何用HTML准确地做到这一点？

解决方案

回答

使用命名锚的锚标签

http://www.w3schools.com/HTML/html_links.asp

回答

给一个容器一个ID，然后使用来引用该ID。

例如

This is main body of my content. I have a footnote link for this line <a href="#footnote-1">[1]</a>. Then, I have some more content. Some of it is interesting and it has some footnotes as well <a href="#footnote-2">[2]</a>.

<p id="footnote-1">[1] Here is my first footnote.</p>
<p id="footnote-2">[2] Another footnote.</p>

回答

在锚标签中使用书签...

This is main body of my content. I have a footnote link for this 
line <a href="#foot1">[1]</a>. Then, I have some more content. 
Some of it is interesting and it has some footnotes as well 
<a href="#foot2">[2]</a>.

<div>
<a name="foot1">[1]</a> Here is my first footnote.
</div>

<div>
<a name="foot2">[2]</a> Another footnote.
</div>

回答

这是我内容的主体。我为此行[1]添加了脚注链接。然后，我还有更多内容。其中一些很有趣，也有一些脚注[2]。

[1]这是我的第一个脚注。

[2]另一个脚注。

做<a href =＃tag>文字</ a>

然后在脚注中：<a name =" tag">文本</ a>

全部没有空格。参考：http://www.w3schools.com/HTML/html_links.asp

回答

<a name="1">脚注</a>

bla bla

<a href="#1">开始</a>作为脚注。

回答

首先，我们要在每个脚注的前面放置一个带有name属性的锚标记。

<a name="footnote1">Footnote 1</a>
 <div>blah blah about stuff</div>

该定位标记将不是链接。这将只是页面的命名部分。然后，将脚注标记标记为引用该命名节的标记。要引用页面的命名部分，请使用符号。

<p>So you can see that the candidate lied 
 <a href="#footnote1">[1]</a> 
 in his opening address</p>

如果要从另一个页面链接到该部分，也可以这样做。只需链接页面，然后在其上添加部分名称即可。

<p>For more on that, see 
 <a href="mypaper.html#footnote1">footnote 1 from my paper</a>
 , and you will be amazed.</p>

回答

我们将需要为所有脚注设置定位标记。给它们加上这样的前缀应该可以做到这一点：
<a name =" FOOTNOTE-1"> [1] </ a>

然后在页面正文中，按如下所示链接到脚注：
<a href ="＃FOOTNOTE-1"> [1] </ a>
(请注意名称与href属性的使用)

本质上，任何时候设置A标签的名称，我们都可以通过链接到＃NAME-USED-IN-TAG来访问它。

http://www.w3schools.com/HTML/html_links.asp具有更多信息。

回答

最好提供从脚注到引用位置的链接(假设存在1：1关系)。这很有用，因为"后退"按钮将使用户返回到以前的滚动位置，从而使读者可以在文本中找到自己的位置。单击返回到文本中脚注位置的链接，将其放在窗口顶部，使读者可以很容易地从停下来的地方开始。

Quirksmode在Web上有一个关于脚注的页面(尽管它建议我们使用脚注而不是脚注，我认为脚注更易于访问，带有脚注的链接和脚注，然后是指向文本的链接，我怀疑它们会更容易并使用屏幕阅读器)。

quirksmode页面中的链接之一建议在脚注的文本链接回之后使用箭头，并为此使用实体。

例如。：

This is main body of my content.
I have a footnote link for this line
<a id="footnote-1-ref" href="#footnote-1">[1]</a>.
Then, I have some more content.
Some of it is interesting and it has some footnotes as well
<a id="footnote-2-ref" href="#footnote-2">[2]</a>.

<p id="footnote-1">
   1. Here is my first footnote. <a href="#footnote-1-ref">&#8617;</a> 
</p>
<p id="footnote-2">
   2. Another footnote. <a href="#footnote-2-ref">&#8617;</a>
</p>

我不确定屏幕阅读器如何处理实体。格鲁伯(Grubber)的评论中与鲍伯·东方(Bob Eastern)关于脚注的可访问性的帖子相关，这表明它未被阅读，尽管那是几年前的事了，我希望屏幕阅读器现在能有所改善。为了实现可访问性，可能需要使用文本锚点，例如"返回文本"，或者将其放置在链接的title属性中。尽管我不知道屏幕阅读器会如何处理，但也可能值得在原始脚注上加上一个。

This is main body of my content.
I have a footnote link for this line
<a id="footnote-1-ref" href="#footnote-1" title="link to footnote">[1]</a>.
Then, I have some more content.
Some of it is interesting and it has some footnotes as well
<a id="footnote-2-ref" href="#footnote-2" title="link to footnote">[2]</a>.

<p id="footnote-1">
   1. Here is my first footnote.
      <a href="#footnote-1-ref" title="return to text">&#8617;</a> 
</p>
<p id="footnote-2">
   2. Another footnote.
      <a href="#footnote-2-ref" title="return to text">&#8617;</a>
</p>

(我只是在这里猜测可访问性问题，但是由于我提到的任何文章都没有提到它，所以我认为值得提出。如果有人可以在这个问题上有更多的权威发言，我将很感兴趣听到。)

回答

对于情况，最好在链接和页脚中分别使用a-href标签和a-name标签来完成此操作。

在滚动到DOM元素的一般情况下，有一个jQuery插件。但是，如果性能是一个问题，我建议我们手动进行。这涉及两个步骤：

• 查找要滚动到的元素的位置。
• 滚动到该位置。

quirksmode很好地解释了前者背后的机制。这是我的首选解决方案：

function absoluteOffset(elem) {
    return elem.offsetParent && elem.offsetTop + absoluteOffset(elem.offsetParent);
}

它使用从null到0的转换，这在某些圈子中不是适当的礼节，但我喜欢它:)第二部分使用window.scroll。因此，其余解决方案是：

function scrollToElement(elem) {
    window.scroll(absoluteOffset(elem));
}

瞧！