JavaScript event handlers

The event handlers in JavaScript are divided into 3 main types:

• HTML Event Handlers:

    <script type= "Text/javascript" >    //HTML event handler    function ShowMessage () {        alert ("clicked!");    };    </script><button id= "btn" onclick= "ShowMessage ()" >click me!</button>

• DOM0-level Event handlers:　　

<button id= "btn" >click me!</button>    <script type= "Text/javascript" >    var btn = document.getElementById ("btn");        DOM0 Level Event handler    Btn.onclick = function () {        alert ("clicked!");    };    </script>

• DOM2-level Event handlers:

<button id= "btn" >click me!</button>    <script type= "Text/javascript" >    var btn = document.getElementById ("btn");        DOM2-level event handler, third parameter: False indicates that the event handler    btn.addeventlistener ("click", Function () {        alert ("clicked!") is called during the bubbling phase;    , false);    </script>

Attach the Compatibility event binding function:

function Listenevent (Eventtarget, EventType, EventHandler) {    if (eventtarget.addeventlistener) {        Eventtarget.addeventlistener (EventType, EventHandler, false);    }    else if (eventtarget.attachevent) {        eventtype = ' on ' + EventType;        Eventtarget.attachevent (EventType, EventHandler);    }    else{        eventtarget[' on ' + eventtype] = EventHandler;    }}

JavaScript event handlers