使用$('#myDiv').click(function(){更好，因为它遵循标准的事件注册模型。(jQuery内部使用addEventListener和attachEvent)。

基本上，以现代方式注册事件是处理事件的一种不引人注目的方式。另外，要为目标注册多个事件监听器，可以为同一个目标调用addEventListener()。

var myEl = document.getElementById('myelement');

myEl.addEventListener('click', function() {
    alert('Hello world');
}, false);

myEl.addEventListener('click', function() {
    alert('Hello world again!!!');
}, false);

http://jsfiddle.net/aj55x/1/

Why use addEventListener? (From MDN) addEventListener is the way to register an event listener as specified in W3C DOM. Its benefits are as follows: It allows adding more than a single handler for an event. This is particularly useful for DHTML libraries or Mozilla extensions that need to work well even if other libraries/extensions are used. It gives you finer-grained control of the phase when the listener gets activated (capturing vs. bubbling) It works on any DOM element, not just HTML elements.

更多关于现代活动注册-> http://www.quirksmode.org/js/events_advanced.html

其他方法，如设置HTML属性，示例:

<button onclick="alert('Hello world!')">

或DOM元素属性，示例:

myEl.onclick = function(event){alert('Hello world');}; 

都是旧的，而且很容易被重写。

应该避免使用HTML属性，因为它会使标记更大，可读性更差。内容/结构和行为的关注点没有很好地分开，使得错误更难被发现。

DOM元素属性方法的问题在于，每个事件只能将一个事件处理程序绑定到一个元素。

更多关于传统事件处理-> http://www.quirksmode.org/js/events_tradmod.html

MDN参考:https://developer.mozilla.org/en-US/docs/DOM/event

关注点分离是这里的关键，因此事件绑定是普遍接受的方法。这基本上是很多现有答案的答案。

但是，不要过快地抛弃声明性标记的想法。它有它的位置，和像Angularjs这样的框架一起，它是核心。

需要有一个理解，整个<div id="myDiv" onClick="divFunction()>Some Content</div>被严重羞辱，因为它被一些开发人员滥用。所以它达到了亵渎的比例，就像桌子一样。有些开发人员实际上避免使用表格来处理表格数据。这是人们不理解行为的完美例子。

尽管我喜欢把我的行为和我的观点分开。我认为标记声明它做什么(而不是它如何做，这是行为)没有问题。它可能是一个实际的onClick属性的形式，也可能是一个自定义属性的形式，很像bootstrap javascript组件。

这样，只需看一眼标记，就可以看到它做了什么，而不是试图反向查找javascript事件绑定器。

因此，作为上述方法的第三种替代方法，使用数据属性来声明标记中的行为。行为被排除在视图之外，但一眼就能看到发生了什么。

自举的例子:

<button type="button" class="btn btn-lg btn-danger" data-toggle="popover" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?">Click to toggle popover</button>

来源:http://getbootstrap.com/javascript/弹窗

注意:第二个示例的主要缺点是对全局名称空间的污染。这可以通过使用上面的第三种选择来避免，或者使用像Angular这样的框架及其带有自动作用域的ng-click属性。

使用onclick的第一种方法不是jQuery，而是简单的Javascript，所以您没有jQuery的开销。jQuery的方式可以通过选择器进行扩展，如果你需要将它添加到其他元素，而不需要为每个元素添加事件处理程序，但现在你有了它，是否需要使用jQuery只是一个问题。

就我个人而言，因为你正在使用jQuery，我会坚持使用它，因为它是一致的，并从脚本中解耦标记。

$ (" # myDiv”)。click更好，因为它将JavaScript代码从HTML中分离出来。必须尽量保持页面行为和结构的不同。这很有帮助。

这样做，因为它将为您提供标准和性能。

 $('#myDiv').click(function(){
      //Some code
 });

因为第二种方法是简单的JavaScript代码，比jQuery更快。但这里的性能大致相同。

不同的作品。如果使用click()，则可以添加几个函数，但如果使用属性，则只执行一个函数—最后一个函数。

DEMO

HTML

<span id="JQueryClick">Click #JQuery</span> </br>
<span id="JQueryAttrClick">Click #Attr</span> </br>

JavaScript

$('#JQueryClick').click(function(){alert('1')})
$('#JQueryClick').click(function(){alert('2')})

$('#JQueryAttrClick').attr('onClick'," alert('1')" ) //This doesn't work
$('#JQueryAttrClick').attr('onClick'," alert('2')" )

如果我们谈论的是性能，在任何情况下直接使用总是更快，但使用属性，您将只能分配一个函数。