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

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

or

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


当前回答

我从你的话中了解到,你想要创建一个链接来运行JavaScript代码。

然后你应该考虑到有人在浏览器中阻止JavaScript。

因此,如果你真的要将该链接仅用于运行JavaScript函数,那么你应该动态添加它,这样即使用户没有在浏览器中启用JavaScript,也不会看到它,而你使用该链接只是为了触发一个JavaScript函数,在浏览器中禁用JavaScript时,使用这样的链接是没有意义的。

由于这个原因,当JavaScript被禁用时,它们都不好。

a如果启用了JavaScript,并且您只想使用该链接调用JavaScript函数,则

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

比使用

<a href="#" onclick="myJsFunc();">Link</a>

因为href=“#”将导致页面执行不需要的操作。

此外,<a href=“javascript:void(0)”onclick=“myJsFunc();”>Link</a>优于<a href=”#“onclick=“myJsFunc(;)”>Link//a>的另一个原因是javascript被用作大多数浏览器的默认脚本语言。例如,InternetExplorer使用onclick属性来定义要使用的脚本语言类型。除非出现另一种好的脚本语言,否则Internet Explorer也会使用JavaScript作为默认语言,但如果另一种脚本语言使用JavaScript:,则会让Internet Explorer了解正在使用的脚本语言。

考虑到这一点,我更喜欢使用和锻炼

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

为了让它成为一种习惯,为了更方便用户,请在JavaScript代码中添加此类链接:

$(document).ready(function(){
    $(".blabla").append('<a href="javascript:void(0)" onclick="myJsFunc();">Link</a>')
});

其他回答

如果您使用的是<a>元素,请使用以下命令:

<a href="javascript:myJSFunc();" />myLink</a>

就我个人而言,我会在稍后使用JavaScript附加一个事件处理程序(使用attachEvent或addEventListener,或者也可以将您最喜欢的JavaScript框架放在这里)。

老实说,我两个都不建议。我会使用一个样式化的<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')之类的字符串,它可以作为一个额外的指示符,显示单击的实际操作。

您可以使用href并删除所有只有哈希值的链接:

HTML格式:

<a href="#" onclick="run_foo()"> foo </a>

JS:

$(document).ready(function(){         // on DOM ready or some other event

   $('a[href=#]').attr('href','');    // set all reference handles to blank strings
                                      //  for anchors that have only hashes

});

4.0之前的引导模式有一个基本上未记录的行为,即它们将使用AJAX从元素加载href,除非它们正好是#。如果您使用的是Bootstrap 3,javascript:void(0);hrefs将导致javascript错误:

AJAX错误:错误GET javascript:void(0);

在这些情况下,您需要升级到引导程序4或更改href。

最好使用jQuery,

$(document).ready(function() {
    $("a").css("cursor", "pointer");
});

并省略href=“#”和href=“javascript:void(0)”。

锚标记标记如下

<a onclick="hello()">Hello</a>

足够简单!