Question

我有一个HTML文档，目前有一些指向页面顶部的链接

<body id="topofpage">
   ...
   <a href="#topofpage">Go to top</a>

但是，我不喜欢创建无用的ID以及点击链接后“#topofpage”如何显示在URL中。我还能做些什么来链接到页面顶部而不使用Javascript吗？我尝试使用<a href="">完全删除锚点，但这会导致页面刷新。

Answer 1

According to the HTML5指定空片段#，特殊片段#top将链接到页面顶部。

<a href="#">Go to top</a>

<a href="#top">Go to top</a>

如果使用这些特殊的片段名称，则无需创建匹配的锚点。

Answer 2

您可以尝试使用javascript

<a onclick="scroll(0,0)">

或者您可以使用jQuery

$("#Top").click(function(){
 scroll(0,0);
});

Answer 3

我知道您在不使用JavaScript的情况下说过，但我认为这是避免使用真正锚点的唯一方法。以下jQuery将使用#top href替换锚点，并在不更改URL的情况下执行一个漂亮的动画滚动到顶部（有关详细信息，请参阅original author页面）。

$(document).ready(function() {
    $('a[href=#top]').click(function(){
        $('html, body').animate({scrollTop:0}, 'slow');
        return false;
    });
})

jsfiddle for completeness

但是，我会坚持使用semantic HTML并使用锚点来实现其目的，以便通过最大数量的浏览器来解释正确的含义。不要忘记需要屏幕阅读器或其他特殊浏览器的残障人士。锚被保证可以工作。

除此之外，Google announced in 2009一些新的索引功能直接利用页内锚点来提供Web搜索者可能正在寻找的其他上下文。在许多情况下，用户可能会对页面的某个部分感兴趣.Google可以提供指向该页面锚点的直接链接，以获得最佳相关性。

从我的角度来看底线 - 不要破坏锚点。使用它们。

Answer 4

使用锚标记获取页面顶部的另一种有用方法是

CAST()

像这样使用它会使您的页面自动滚动到当前页面的顶部。希望这对某人有用。

Answer 5

<a href="?">top</a>会帮助你。

在不使用锚点的情况下创建指向网页顶部的链接

5 个答案: