Question

快速问题。

我们应该将Javascript放在HREF中还是使用onClick（事件）？

使用其中任何一个是否有任何利弊。我个人认为简单地将代码放入href更简单/更清洁，而不必返回false或担心跳转到＃

每种方法都有任何已知的浏览器特定问题......

示例：

<a href="javascript: alert('foo!');">Click Me</a>
<a href="#" onClick="alert('foo!');return false">Click Me</a>
<a href="javascript:void(0)" onclick="alert('foo!');">Click Me</a>

Answer 1

1）而是使用onclick。当不允许使用JS时，请务必在href中设置合理的后备网址。

2）您应该使用事件处理程序而不是onclick="..."。使用jQuery或XPath查找元素，然后为每个元素调用element.addEventListener()。

element.addEventListener("click", function() { alert("bar"); }, false);

或旧方式......

element.onclick = function() { alert("foo"); };

Answer 2

保持代码与html分离是更清洁的IMO。

<a id="foo" href="#">Click Me</a>

然后在head或单独的js文件中：

document.getElementByID("foo").onclick = function() { alert("hi"); }

Answer 3

我个人不会将JavaScript代码放在HTML中。您应该使用在单击<a>时触发的事件侦听器。

<a href="#" id="linkA">Click Me</a>

然后：

document.getElementById('linkA').addEventListener('click', function(e){
    e.preventDefault(); // Prevents page from scrolling to the top
    alert('foo!');
});

Answer 4

在onclick事件中（尽管使用JS而不是属性分配）具有合理的href属性。 Build on things that work

Answer 5

通常，我会外化JavaScript但使用href来调用它：

<a href="javascript:foo('bar!');">Click Me</a>

虽然我认为您的快速alert示例可以作为规则的例外。

但是，如果您使用像jQuery这样的JS库，您当然可以直接分配事件 - 请参阅jQuery教程中的第一个示例，该示例查看锚元素http://docs.jquery.com/Tutorials:How_jQuery_Works

Javascript和Anchor标签，最佳实践？

5 个答案: