以下是构建链接的两种方法,该链接的唯一目的是运行JavaScript代码。在功能、页面加载速度、验证目的等方面,哪个更好。?

函数myJsFunc(){警报(“myJsFunc”);}<a href=“#”onclick=“myJsFunc();”>运行JavaScript代码</a>

or

函数myJsFunc(){警报(“myJsFunc”);}运行javascript代码</a>


当前回答

我建议改用<button>元素,特别是当控件应该在数据中产生更改时。(类似于POST。)

如果不引人注目地注入元素,这是一种渐进式增强,效果会更好。(请参阅此评论。)

其他回答

javascript:void(0)将在将来弃用,因此您应该使用#。

根据您想要完成的任务,您可以忘记onclick,只需使用href:

<a href="javascript:myJsFunc()">Link Text</a>

它避免了返回false的需要。我不喜欢#选项,因为如上所述,它会将用户带到页面顶部。如果你有其他地方可以发送用户,如果他们没有启用JavaScript(这在我工作的地方很少见,但这是一个非常好的主意),那么Steve提出的方法非常有效。

<a href="javascriptlessDestination.html" onclick="myJSFunc(); return false;">Link text</a>

最后,如果您不想任何人去任何地方,也不想调用javascript函数,那么可以使用javascript:void(0)。如果您有一个想要发生鼠标悬停事件的图像,但没有任何内容可供用户单击,那么它会非常有用。

我想说,最好的方法是将href锚定到一个你从未使用过的ID上,比如#Do1Not2Use3This4Id5或类似的ID,你100%确信没有人会使用,也不会冒犯他人。

Javascript:void(0)是一个坏主意,违反了启用CSP的HTTPS页面上的内容安全策略https://developer.mozilla.org/en/docs/Security/CSP(感谢@jakub.g)仅使用#将使用户在按下时跳回到顶部如果未启用JavaScript,则不会破坏页面(除非您有JavaScript检测代码如果启用了JavaScript,则可以禁用默认事件除非你知道如何阻止浏览器选择某些文本,否则你必须使用href(不知道使用4是否会消除阻止浏览器选择文本的因素)

基本上没有人在这篇文章中提到5,我认为这很重要,因为如果你的网站突然开始围绕链接进行选择,它会显得不专业。

您也可以在锚点中编写如下提示:

<a href="javascript:void('open popup image')" onclick="return f()">...</a>

因此用户将知道该链接的作用。

当我有几个人造链接时,我更喜欢给它们一个“没有链接”的类。

然后在jQuery中,我添加了以下代码:

$(function(){
   $('.no-link').click(function(e){
       e.preventDefault();
   });
});

对于HTML,链接简单

<a href="/" class="no-link">Faux-Link</a>

我不喜欢使用哈希标签,除非它们用于锚点,并且只有当我有两个以上的虚假链接时,我才会使用上面的方法,否则我会使用javascript:void(0)。

<a href="javascript:void(0)" class="no-link">Faux-Link</a>

通常情况下,我喜欢完全避免使用链接,只在一个跨度中包装一些东西,并将其用作激活某些JavaScript代码的方式,如弹出窗口或内容显示。