How about something like this? <html> <head> <script type=”text/javascript”> var HoverListener = { addElem: function( elem, callback, delay ) { if ( delay === undefined ) { delay = 1000; } var hoverTimer; addEvent( elem, ‘mouseover’, function() { hoverTimer = setTimeout( callback, delay ); } ); addEvent( elem, ‘mouseout’, function() { clearTimeout( hoverTimer ); } … Read more
Assign your onclick handler after document is loaded. <script type=”text/javascript” charset=”utf-8″> function assignHandler() { var btn = document.getElementById(“myBtn”); btn.onclick = function() { alert(“Clicked”); }; } </script> <body onload=”assignHandler()”> <a id=”myBtn” href=”#”>click me </a> </body>
What you’re missing is there are different elements of the performance. Your first example performs worse when setting up the click handler, but performs better when the actual event is triggered. Your second example performs better when setting up the click handler, but performs significantly worse when the actual event is triggered. If all events … Read more
It’s because that function isn’t in a global context, which is where your onclick=”” is looking for it. You need to move it outside your document.ready (so it’s not scoped exclusively to that closure), or (a better approach IMO) bind it inside the document.ready, here’s what I mean by each: Binding it inside (remove your … Read more