Javascript和Anchor标签,最佳实践?

Wes*_*son 15 html javascript

快速问题.

我们应该将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>
Run Code Online (Sandbox Code Playgroud)

Ond*_*žka 12

1)而是使用onclick.href当不允许使用JS时,请务必使用合理的后备URL .

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

element.addEventListener("click", function() { alert("bar"); }, false);
Run Code Online (Sandbox Code Playgroud)

或旧方式......

element.onclick = function() { alert("foo"); };
Run Code Online (Sandbox Code Playgroud)


Joh*_*ehm 8

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

<a id="foo" href="#">Click Me</a>
Run Code Online (Sandbox Code Playgroud)

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

document.getElementByID("foo").onclick = function() { alert("hi"); }
Run Code Online (Sandbox Code Playgroud)