主要是在内存泄漏上的改进
(function() { window.EventUtils = { eventFuncs : [], addEvent : function(o, n, f) { var el, id; // Resolve element by id if needed o = typeof(o) == 'string' ? document.getElementById(o) : o; if (o.attachEvent) { // Since we can't use attachEvent we need to generate an unique id for the object // and place functions in an array one for each object el = EventUtils.eventFuncs; id = o._evtID; if (!el[id]) { // Generate new unique id id = o._evtID = el.length; // Add event listener old fashion way instead of attachEvent o['on' + n] = function() { var i, l, e = window.event, li; e.target = e.srcElement; // Force W3C style // Execute each event listener in order for (i = 0, li = el[e.target._evtID], l = li.length; i < l; i++) li[i](e); }; // Create array with first function el[id] = [f]; } else el[id].push(f); // Push in more functions // Fix the IE leak o = null; } else if (o.addEventListener) o.addEventListener(n, f, false); else o['on' + n] = f; return f; }, removeEvent : function(o, n, f) { var i, li; // Resolve element by id if needed o = typeof(o) == 'string' ? document.getElementById(o) : o; if (o.detachEvent) { li = EventUtils.eventFuncs[o._evtID]; if (li) { // Detach event listener by looking for it and remove it from the array for (i = 0; i < li.length; i++) { if (li[i] === f) li.splice(i, 1); } } } else if (o.removeEventListener) o.removeEventListener(n, f, false); else o['on' + n] = null; } }; })();
addEvent : function(o, n, f) {
var el, id;
// Resolve element by id if needed
o = typeof(o) == 'string' ? document.getElementById(o) : o;
if (o.attachEvent) {
// Since we can't use attachEvent we need to generate an unique id for the object
// and place functions in an array one for each object
el = EventUtils.eventFuncs;
id = o._evtID;
if (!el[id]) {
// Generate new unique id
id = o._evtID = el.length;
// Add event listener old fashion way instead of attachEvent
o['on' + n] = function() {
var i, l, e = window.event, li;
e.target = e.srcElement; // Force W3C style
// Execute each event listener in order
for (i = 0, li = el[e.target._evtID], l = li.length; i < l; i++)
li[i](e);
};
// Create array with first function
el[id] = [f];
} else
el[id].push(f); // Push in more functions
// Fix the IE leak
o = null;
} else if (o.addEventListener)
o.addEventListener(n, f, false);
else
o['on' + n] = f;
return f;
},
removeEvent : function(o, n, f) {
var i, li;
// Resolve element by id if needed
o = typeof(o) == 'string' ? document.getElementById(o) : o;
if (o.detachEvent) {
li = EventUtils.eventFuncs[o._evtID];
if (li) {
// Detach event listener by looking for it and remove it from the array
for (i = 0; i < li.length; i++) {
if (li[i] === f)
li.splice(i, 1);
}
}
} else if (o.removeEventListener)
o.removeEventListener(n, f, false);
else
o['on' + n] = null;
}
};
})();
function addListeners() {
var f;
EventUtils.addEvent('elm', 'click', function(e) {
alert('Listener 1: ' + e.target.id);
});
f = EventUtils.addEvent('elm', 'click', function(e) {
alert('Listener 2: ' + e.target.id);
});
EventUtils.addEvent('elm', 'click', function(e) {
alert('Listener 3: ' + e.target.id);
});
EventUtils.removeEvent('elm', 'click', f);
}
</script>
</head>
<body onload="addListeners();">
<h1>Example of an simple event class not using the unload event</h1>
<div id="elm">Click me and try me in Drip or sIEve!</div>
</body>
</html>