锚标签的正确用法是什么?

问题描述 投票:1回答:4

我已经读过锚标签是如何神圣的,它不应该与javascript一起使用:

<a href="javascript:(alert('no!'))">Popup</a>

它应该只用于链接到另一个页面:

<a href="/grassIsAlwaysGreener.html">Take me over there</a>

那么使用javascript正确使用锚标签是什么?我应该使用:

<a href="#" onclick="someJsFn();">Energize!</a>

还是其他一些变种?我对这个问题的不同观点感到有些困惑。如果让href成为一个javascript片段,我应该担心的只是SEO吗?或者它更适合网络标准合规协议?

思考?希望我不是唯一一个困惑的人。

javascript html anchor
4个回答
1
投票

你并不孤单雅各布;即使是最大的WWW公司也使用不同的方法。

但是根据自Netscape时代以来的经验,我不会使用:

<a href="javascript:(alert'no!')">Popup</a>

这可能会在某些浏览器上造成一些麻烦,例如打开空白页面或打破当前页面上的事件顺序。

然而;

<a href="#" onclick="someJsFn();">Energize!</a>

要么;

<a href="javascript:void(0)" onclick="myJsFunc();">Link</a>

不要犯下严重的麻烦,可以使用。请注意,前一个可能会将滚动重置为顶部。

你应该尽可能使用有意义的链接目标和不引人注目的javascript,但在现实生活中的例子并不总是这样。它不是一个定义的标准,而是大多数Web开发人员高度同意的方法。

在标准方面,有一个与这种情况有关:

您应该考虑使用“按钮”作为输入,这些输入并不真正将访问者发送到页面,而是进行操作。这对SEO也很重要。


1
投票

正如@Sime所说(它应该是一个真正的答案),现在直接在任何HTML对象中引用javascript被认为是“不好的做法”。所以在这些情况下,你使用jQuery这样的东西来附加事件,使用“不显眼的javascript”中的概念。

正如您所提到的另一个考虑因素是SEO和可访问性。如果SEO对您的网站很重要,请确保只使用标准链接即可完全导航该网站。你可以再次使用“不显眼的javascript”等来管理它。


0
投票

我总是像往常一样使用锚点(即指定一个备用URL,这是另一个用户可以通过javascript执行操作的位置,或者使用javascript:void() / #)然后使用onclick事件来执行任何操作。

你也可以使用<span>,如果你担心一致性,只需要设计它(更改光标,也许是颜色),以使视觉上显而易见,你正在使它成为一个动作。

我认为Facebook是最好的例子。他们几乎所有的链接都是javascript捆绑在一起,但他们也有一个“备份”页面,供那些不允许使用javascript或者没有javascript的人使用(后者,在这个时代,并不常见)。看一下像你一样对你做出反应的模块,看看他们是如何做到的。他们还在最佳实践中投入了大量工作,您可以从中受益。


0
投票

如果有的话,你应该只使用像Paul提到的不引人注目的javascript将你的锚链接绑定到javascript方法。

这意味着,使用关注点分离并使您的标记只是那个,html标记:

<a id="Jolter">Energize!</a>

然后

<script type="text/javascript">
    $(document).ready(function(){
        $("#Jolter").click(function(){
            // doStuffHere ...
        });
    });
</script>
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.