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

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

or

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


当前回答

这里实际上有四种选择。

使用return false;允许您保留锚版本,以防在禁用JavaScript的浏览器中出现安全的“回退”,或者用户代理不支持(现在用户的1-5%)。如果脚本失败,可以使用锚定符“#”、空字符串或href的特殊URL。请注意,您必须使用href,以便屏幕读者知道它是一个超链接。(注意:我不会讨论删除href属性的问题,因为这一点在这里没有意义。锚上没有href意味着锚不再是一个超链接,而只是一个html标记,上面有一个被捕获的点击事件。)

<a href="" onclick="alert('hello world!');return false;">My Link</a>
<a href="#" onclick="alert('hello world!');return false;">My Link</a>
<a href="MyFallbackURL.html" onclick="alert('hello world!');return false;">My Link</a>

下面是目前在href属性中使用javascript:void(0)的更流行的设计。如果浏览器不支持脚本,则应再次将其发布回页面,因为href超链接路径返回了一个空字符串。如果您不关心谁支持JavaScript,请使用此选项。

<a href="javascript:void(0);" onclick="alert('hello world!');">My Link</a>

其他回答

•Javascript:无效(0);为空值[Notassigned],这意味着浏览器将返回null,单击DOM,窗口将返回false。•javascript中的“#”不在DOM或Window之后。这意味着锚href内的“#”符号是LINK。链接到相同的当前方向。

我用开发工具在谷歌chrome中尝试了这两种方法,结果id=“#”花了0.32秒。而javascript:void(0)方法只花了0.18秒。因此,在googlechrome中,javascript:void(0)工作得更好更快。

也不

如果您可以有一个实际的URL,请将其用作HREF。如果有人中间点击你的链接打开一个新的标签,或者他们禁用了JavaScript,onclick就不会启动。

如果这是不可能的,那么您至少应该使用JavaScript和适当的单击事件处理程序将锚标记注入到文档中。

我意识到这并不总是可能的,但在我看来,在开发任何公共网站时都应该努力做到这一点。

查看Unobrusive JavaScript和Progressive增强(两个维基百科)。

老实说,我两个都不建议。我会使用一个样式化的<button></button>来实现该行为。

按钮链接{显示:内联块;位置:相对;背景色:透明;光标:指针;边框:0;填充:0;颜色:#00f;文本装饰:下划线;字体:inherit;}<p>一个看起来像<button type=“button”class=“link”>链接</button>的按钮</p>

这样您就可以分配onclick。我还建议通过脚本绑定,而不是在元素标记上使用onclick属性。唯一的问题是旧IE中无法禁用的伪3d文本效果。


如果必须使用A元素,请使用javascript:void(0);由于已经提到的原因。

如果onclick事件失败,将始终进行拦截。不会发生错误的加载调用,或基于哈希更改触发其他事件如果单击失败(onclick throws),哈希标记可能会导致意外行为,除非这是一个适当的失败行为,并且您希望更改导航历史记录,否则请避免它。

注意:您可以将0替换为javascript:void('删除记录123')之类的字符串,它可以作为一个额外的指示符,显示单击的实际操作。

除非您使用JavaScript编写链接(这样您就知道它在浏览器中已启用),否则理想情况下,您应该为禁用JavaScript的浏览者提供适当的链接,然后在onclick事件处理程序中阻止该链接的默认操作。这样,启用JavaScript的用户将运行该功能,而禁用JavaScript的用户则将跳转到适当的页面(或同一页面中的位置),而不是只单击链接而不发生任何事情。