以下是构建链接的两种方法,该链接的唯一目的是运行JavaScript代码。在功能、页面加载速度、验证目的等方面,哪个更好。?
函数myJsFunc(){警报(“myJsFunc”);}<a href=“#”onclick=“myJsFunc();”>运行JavaScript代码</a>
or
函数myJsFunc(){警报(“myJsFunc”);}运行javascript代码</a>
以下是构建链接的两种方法,该链接的唯一目的是运行JavaScript代码。在功能、页面加载速度、验证目的等方面,哪个更好。?
函数myJsFunc(){警报(“myJsFunc”);}<a href=“#”onclick=“myJsFunc();”>运行JavaScript代码</a>
or
函数myJsFunc(){警报(“myJsFunc”);}运行javascript代码</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代码的方式,如弹出窗口或内容显示。
其他回答
我会使用:
<a href="#" onclick="myJsFunc();return false;">Link</a>
原因:
这使得href变得简单,搜索引擎需要它。如果您使用其他任何东西(例如字符串),它可能会导致404未找到错误。当鼠标悬停在链接上时,它不会显示它是一个脚本。通过使用return false;,页面不会跳到顶部或断开后退按钮。
我强烈希望尽可能将JavaScript排除在HTML标记之外。如果我使用<a>作为单击事件处理程序,那么我建议使用<a class=“trigger”href=“#”>单击我</a> 。
$('.trigger').click(function (e) {
e.preventDefault();
// Do stuff...
});
需要注意的是,许多开发人员认为,使用锚标记来处理点击事件是不好的。他们希望您使用带有一些CSS的<span>或<div>来添加游标:指针;这是一个争论不休的问题。
如果您使用的是<a>元素,请使用以下命令:
<a href="javascript:myJSFunc();" />myLink</a>
就我个人而言,我会在稍后使用JavaScript附加一个事件处理程序(使用attachEvent或addEventListener,或者也可以将您最喜欢的JavaScript框架放在这里)。
如果您恰好使用AngularJS,可以使用以下选项:
<a href="">Do some fancy JavaScript</a>
这不会有任何作用。
此外
它不会像(#)那样将您带到页面顶部因此,您不需要使用JavaScript显式返回false它简短而简洁
#比javascript:任何东西都好,但以下内容甚至更好:
HTML格式:
<a href="/gracefully/degrading/url/with/same/functionality.ext" class="some-selector">For great justice</a>
JavaScript:
$(function() {
$(".some-selector").click(myJsFunc);
});
您应该始终努力实现优雅的降级(在用户没有启用JavaScript的情况下……以及在有规范和预算的情况下)。此外,在HTML中直接使用JavaScript属性和协议被认为是不好的形式。