使用$('#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