We know that the interaction between JavaScript and HTML is done through events, something that the user or the browser itself performs, such as Click, Mounseover, Load ..., and the function that responds to the event is called the event handler function (or event listener).
<ptml> <pead> <title>event util test</title> <script type= "Text/javascript" > Var event Util = {addlistener:function (element, type, hander) {if (Element.addeventlistener) {Element.addeventlistener (type), hander, false); else if (element.attachevent) {element.attachevent (' on ' + type, hander); else {element[' on ' + type] = hander; }, Getevent:function (event) {return event | | window.event; Return event? Event:window.event; }, Gettarget:function (event) {return Event.target | | event.srcelement; }, Preventdefault:function (event) {if (Event.preventdefault) {event.preventdefault (); else {event.returnvalue = false; }, Removelistener:function (element, type, hander) {if (Element.removeeventlistener) {Element.removeeventlistener ( Type, hander, false); else if (element.deattachevent) {element.detachevent (type, hander); else {element[' on ' + type] = NULL; }}, Stoppropagation:function (event) {if (event.stoppropagation) {event.stoppropagation (); else {event.cancelbubble = true; } } }; </script> </pead> <body> <input type= "button" value= "click Me" id= "btn"/> Baidu <script t Ype= "Text/javascript" > (function () {var btn = document.getElementById ("btn"); var link = document.getelementsbytagname ("a") [0]; Eventutil.addlistener (Link, "click", Function (event) {alert ("Prevent default event"); var event = eventutil.getevent (event); Eventutil.preventdefault (event); }); Eventutil.addlistener (BTN, "click", Function (event) {var event = eventutil.getevent (event); var target = Eventutil.gettarget (event); alert (Event.type); alert (target); Eventutil.stoppropagation (event); }); Eventutil.addlistener (Document.body, "click", Function () {alert ("click Body"); }); })(); </script> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]